Now many of the site's banner pictures are full-screen width, such a site looks very atmospheric. This kind of banner usually makes a big picture, then displays the middle part of the picture at different resolutions. The implementation method is as follows:
<HTML> <Head> <title>Title</title> <style>. Bannerbox{width:100%;position:relative;Overflow:Hidden;Height:500px; }. Banner{width:1920px; /*Picture Width*/position:Absolute; Left:50%;Margin-left:-960px; /*half the width of the picture*/ } </style> </Head> <Body> <Divclass= "Bannerbox"> <Divclass= "banner"> <imgsrc= "T1.jpg"> </Div> </Div> </Body> </HTML>
Change the height and. Banner and width of the CSS. Bannerbox to the size of your banner chart, and then. Banner Margin-left value to half the width of the banner chart.
A way to make oversized banner pictures do not stretch, full screen width, center display