1.img picture content is centered at different resolutions (if hidden, set a div outside the IMG set Overflow:hidden. The size of the div is the size of the IMG display area)
<!DOCTYPE HTML><HTML><Head><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /><title>Untitled Document</title><styletype= "Text/css">Body,div,p,a,img,ul,ol,li{margin:0;padding:0;}#tab{Overflow:Hidden;
Width:100%; the width to display }#tab img{Overflow:Hidden;width:1920px;Height:447px;position:relative;
Left:50%; Just in the middle.
Margin-left:-960px; half picture width }#tab >img:not (: first-child){Display:None; } </style><Script> //JS Slideshowwindow.onload= function(){ varImages=document.getElementsByTagName ('img'); varPOS= 0; varLen=images.length; SetInterval (function() {Images[pos].style.display= 'None'; POS= ++POS==Len? 0: POS; Images[pos].style.display= 'inline'; }, the); };</Script> </Head> <Body><DivID= "tab"> <imgsrc= "Images/20160907_100403_003.jpg"width= "1920px"Height= "447"/> <imgsrc= "Images/20160907_100403_004.jpg"width= "1920px"Height= "447"/> </Div></Body></HTML>
2. Background image content is centered at different resolutions (the picture width of the presentation is 1920px, when the width of the picture is greater than the width of the display)
<class= "Index-panel-pic1"></div>
. Index-panel-pic1 { background: url (.. /images/20160907_100403_000.gif) No-repeat Center Center; width:100%; height:650px; background-size: cover;}
CSS picture content is centered at different resolutions (the picture width of the presentation is 1920px, when the width of the image is greater than the width of the display)