我正在开发一个从外部源(eBay产品列表)导入HTML的网站。我试图确定什么CSS或HTML阻止产品描述中的图像响应调整大小。
以下是示例页面:
http://216.120.237.30/~theioutlet/product/test-product/
我最感兴趣的图像是响应(尽管它们都应该是):
和
和各种按钮
有一次,我改变了一些非常简单的事情,图像开始响应地调整大小。但当时我正在开发第三方ebay导入插件演示网站,我不记得在这些测试中我改变了什么,而且我无法再现这种效果。令人沮丧。
1) 你能告诉我是什么阻止图像(在产品描述中)响应地调整大小?
我试图在jsfiddle上重新创建代码,https://jsfiddle.net/250rcgbb/
那里可能有过多的CSS,因为我已经提取了相关页面加载的各种CSS源代码。由于我不确定哪个声明(或声明的组合)导致了这个问题(因此我的问题),我将其保留为原样。
这是我在jsfiddle上发布的代码:
.plus,
.minus {
background: none !important;
}
.sd-fixed-width .site {
background-color: #fcfcfc;
}
.sticky-wrapper,
.sd-sticky-navigation,
.sd-sticky-navigation:before,
.sd-sticky-navigation:after {
background-color: #2c2d33;
}
.main-navigation ul li a,
.site-title a,
ul.menu li a,
.site-branding h1 a,
.site-footer .storefront-handheld-footer-bar a:not(.button),
button.menu-toggle,
button.menu-toggle:hover {
color: #aaaaaa;
}
button.menu-toggle,
button.menu-toggle:hover {
border-color: #aaaaaa;
}
.main-navigation ul li a:hover,
.main-navigation ul li:hover > a,
.site-title a:hover,
a.cart-contents:hover,
.site-header-cart .widget_shopping_cart a:hover,
.site-header-cart:hover > li > a,
ul.menu li.current-menu-item > a {
color: #dcdcdc;
}
table th {
background-color: #e6e6e6;
}
table tbody td {
background-color: #ebebeb;
}
table tbody tr:nth-child(2n) td {
background-color: #e9e9e9;
}
.site-header,
.secondary-navigation ul ul,
.main-navigation ul.menu > li.menu-item-has-children:after,
.secondary-navigation ul.menu ul,
.storefront-handheld-footer-bar,
.storefront-handheld-footer-bar ul li > a,
.storefront-handheld-footer-bar ul li.search .site-search,
button.menu-toggle,
button.menu-toggle:hover {
background-color: #333333;
}
p.site-description,
.site-header,
.storefront-handheld-footer-bar {
color: #878787;
}
.storefront-handheld-footer-bar ul li.cart .count,
button.menu-toggle:after,
button.menu-toggle:before,
button.menu-toggle span:before {
background-color: #aaaaaa;
}
.storefront-handheld-footer-bar ul li.cart .count {
color: #333333;
}
.storefront-handheld-footer-bar ul li.cart .count {
border-color: #333333;
}
h1,
h2,
h3,
h4,
h5,
h6 {
color: #333333;
}
.widget h1 {
border-bottom-color: #333333;
}
body,
.secondary-navigation a,
.onsale,
.pagination .page-numbers li .page-numbers:not(.current),
.woocommerce-pagination .page-numbers li .page-numbers:not(.current) {
color: #666666;
}
.widget-area .widget a,
.hentry .entry-header .posted-on a,
.hentry .entry-header .byline a {
color: #989898;
}
a {
color: #45924a;
}
a:focus,
.button:focus,
.button.alt:focus,
.button.added_to_cart:focus,
.button.wc-forward:focus,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus {
outline-color: #45924a;
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
.added_to_cart,
.widget a.button,
.site-header-cart .widget_shopping_cart a.button {
background-color: #333333;
border-color: #333333;
color: #ffffff;
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.button:hover,
.added_to_cart:hover,
.widget a.button:hover,
.site-header-cart .widget_shopping_cart a.button:hover {
background-color: #1a1a1a;
border-color: #1a1a1a;
color: #ffffff;
}
button.alt,
input[type="button"].alt,
input[type="reset"].alt,
input[type="submit"].alt,
.button.alt,
.added_to_cart.alt,
.widget-area .widget a.button.alt,
.added_to_cart,
.pagination .page-numbers li .page-numbers.current,
.woocommerce-pagination .page-numbers li .page-numbers.current,
.widget a.button.checkout {
background-color: #45924a;
border-color: #45924a;
color: #ffffff;
}
button.alt:hover,
input[type="button"].alt:hover,
input[type="reset"].alt:hover,
input[type="submit"].alt:hover,
.button.alt:hover,
.added_to_cart.alt:hover,
.widget-area .widget a.button.alt:hover,
.added_to_cart:hover,
.widget a.button.checkout:hover {
background-color: #2c7931;
border-color: #2c7931;
color: #ffffff;
}
#comments .comment-list .comment-content .comment-text {
background-color: #e6e6e6;
}
.site-footer {
background-color: #f0f0f0;
color: #666666;
}
.site-footer a:not(.button) {
color: #666666;
}
.site-footer h1,
.site-footer h2,
.site-footer h3,
.site-footer h4,
.site-footer h5,
.site-footer h6 {
color: #333333;
}
#order_review,
#payment .payment_methods li .payment_box {
background-color: #ededed;
}
#payment .payment_methods li {
background-color: #e8e8e8;
}
#payment .payment_methods li:hover {
background-color: #e3e3e3;
}
@media screen and ( min-width: 768px) {
.secondary-navigation ul.menu a:hover {
color: #a0a0a0;
}
.secondary-navigation ul.menu a {
color: #878787;
}
.site-header-cart .widget_shopping_cart,
.main-navigation ul.menu ul.sub-menu,
.main-navigation ul.nav-menu ul.children {
background-color: #2b2b2b;
}
}
</style> <link rel='stylesheet' id='storefront-fonts-css' href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,300,300italic,400italic,700,900&subset=latin%2Clatin-ext' type='text/css' media='all' /> <link rel='stylesheet' id='storefront-jetpack-style-css' href='http://216.120.237.30/~theioutlet/wp-content/themes/storefront/assets/sass/jetpack/jetpack.css?ver=2.0.1' type='text/css' media='all' /> <link rel='stylesheet' id='sd-styles-css' href='http://216.120.237.30/~theioutlet/wp-content/plugins/storefront-designer/assets/css/style.css?ver=4.5.2' type='text/css' media='all' /> <link rel='stylesheet' id='sd-styles-2-css' href='http://216.120.237.30/~theioutlet/wp-content/plugins/storefront-designer/assets/css/style-2.css?ver=4.5.2' type='text/css' media='all' /> <link rel='stylesheet' id='sph-styles-css' href='http://216.120.237.30/~theioutlet/wp-content/plugins/storefront-parallax-hero/assets/css/style.css?ver=4.5.2' type='text/css' media='all' /> <style id='sph-styles-inline-css' type='text/css'> .sph-hero a:not(.button) {
color: #96588a;
}
.overlay.animated h1:after {
color: #96588a;
}
.overlay.animated span:before {
background-color: #45924a;
}
</style> <link rel='stylesheet' id='storefront-woocommerce-style-css' href='http://216.120.237.30/~theioutlet/wp-content/themes/storefront/assets/sass/woocommerce/woocommerce.css?ver=4.5.2' type='text/css' media='all' /> <style id='storefront-woocommerce-style-inline-css' type='text/css'> a.cart-contents,
.site-header-cart .widget_shopping_cart a {
color: #aaaaaa;
}
table.cart td.product-remove,
table.cart td.actions {
border-top-color: #ededed;
}
.woocommerce-tabs ul.tabs li.active a,
ul.products li.product .price,
.onsale,
.widget_search form:before,
.widget_product_search form:before {
color: #666666;
}
.woocommerce-breadcrumb a,
a.woocommerce-review-link,
.product_meta a {
color: #989898;
}
.onsale {
border-color: #666666;
}
.star-rating span:before,
.quantity .plus,
.quantity .minus,
p.stars a:hover:after,
p.stars a:after,
.star-rating span:before,
#payment .payment_methods li input[type=radio]:first-child:checked+label:before {
color: #45924a;
}
.widget_price_filter .ui-slider .ui-slider-range,
.widget_price_filter .ui-slider .ui-slider-handle {
background-color: #45924a;
}
.woocommerce-breadcrumb,
#reviews .commentlist li .comment_container {
background-color: #e6e6e6;
}
.order_details {
background-color: #e6e6e6;
}
.order_details li {
border-bottom: 1px dotted #d1d1d1;
}
.order_details:before,
.order_details:after {
background: -webkit-linear-gradient(transparent 0, transparent 0), -webkit-linear-gradient(135deg, #e6e6e6 33.33%, transparent 33.33%), -webkit-linear-gradient(45deg, #e6e6e6 33.33%, transparent 33.33%)
}
@media screen and ( min-width: 768px) {
.site-header-cart .widget_shopping_cart,
.site-header .product_list_widget li .quantity {
color: #878787;
}
}
.main-navigation ul li.smm-active li ul.products li.product h3 {
color: #878787;
}
.single-product div.product .onsale + .product_title + .woocommerce-product-rating + div[itemprop="offers"] .price {
border-color: #45924a;
}
.sd-header-sticky .secondary-navigation {
background-color: #ededed;
}
.page-template-template-homepage .site-main ul.tabs li a,
.woocommerce-breadcrumb a {
color: #666666;
}
.pagination .page-numbers li .page-numbers.current,
.woocommerce-pagination .page-numbers li .page-numbers.current {
background-color: transparent;
border-color: #45924a;
color: #45924a;
}
.woocommerce-breadcrumb {
color: #b1b1b1;
}
.page-template-template-homepage .site-main ul.tabs li a.active,
.page-template-template-homepage .site-main ul.tabs li a:hover,
.single-product div.product .woocommerce-product-rating a,
.woocommerce-breadcrumb a:hover {
color: #343434;
}
ul.products li.product .star-rating span:before,
.page-template-template-homepage .site-main .storefront-product-section ~ .storefront-product-section:not(.last) ul.products li.product.product-category h3,
.page-template-template-homepage .site-main .storefront-product-section ~ .storefront-product-section:not(.last) ul.products li.product.product-category h3 mark {
color: #333333;
}
ul.products li.product a:hover h3,
ul.products li.product .price,
.single-product div.product .summary .price,
.page-template-template-homepage .site-main .storefront-product-section ~ .storefront-product-section ul.products li.product.product-category a:hover h3,
.page-template-template-homepage .site-main .storefront-product-section ~ .storefront-product-section ul.products li.product.product-category a:hover h3 mark {
color: #45924a;
}
.single-product div.product .onsale,
ul.products li.product.product-category a:hover h3,
ul.products li.product a .onsale {
background-color: #45924a;
}
.a-primary-navigation {
border-top-color: #45924a;
}
.site-header-cart .widget_shopping_cart a {
color: #aaaaaa;
}
.main-navigation ul li a:hover,
.main-navigation ul li:hover > a,
.main-navigation ul.menu li.current-menu-item > a,
.main-navigation ul.nav-menu li.current-menu-item > a,
.site-header-cart .widget_shopping_cart a:hover,
.main-navigation ul li.smm-active .widget ul:not(.products) li a:hover {
color: #dcdcdc !important;
}
.site-title a,
.site-branding h1 a,
ul.menu li a.cart-contents {
color: #464646;
}
.site-title a:hover,
.site-branding h1 a:hover,
ul.menu li a.cart-contents:hover {
color: #141414;
}
@media screen and (min-width: 768px) {
.site-header-cart .cart-contents span.count:before {
border-color: #45924a;
}
.site-header-cart .widget_shopping_cart,
.main-navigation > li > a:before,
.main-navigation ul.menu > li > a:before,
.main-navigation ul.nav-menu > li > a:before {
border-top-color: #45924a;
}
.site-header-cart .cart-contents span.count:after {
border-top-color: #45924a;
border-left-color: #45924a;
border-right-color: #45924a;
}
}
@charset "utf-8";
/* CSS Document */
#container {
width: 920px
}
#header {
margin-bottom: 10px;
color: #FFFFFF;
width: 900px;
margin-left: 10px;
margin-right: 10px;
}
.col1 {
float: left;
width: 540px;
margin-left: 10px;
display: inline;
}
.col2 {
float: left;
width: 350px;
margin-left: 10px;
margin-right: 10px;
}
.col3 {
float: left;
width: 630px;
margin-left: 10px;
display: inline;
}
.col4 {
float: left;
width: 260px;
margin-left: 10px;
margin-right: 10px;
}
.full {
clear: both;
padding-top: 25px;
width: 900px;
margin-left: 10px;
margin-right: 10px;
}
br {
line-height: 5px;
}
h2,
p {
margin-left: 7px;
margin-right: 7px;
margin-top: 7px;
margin-bottom: 7px;
text-align: center;
}
ul {
list-style-image: url(../images/tick.png);
}
li {
color: black;
padding: 0;
padding-left: 1em;
margin-bottom: 10px;
background-position: 2em;
}
.ribbon {
width: 90%;
margin: 10px auto;
padding: 0 10px 0;
position: relative;
color: #444;
background: #fff;
border: 1px solid #45924A;
border-radius: 3px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.ribbon h3 {
display: block;
height: 30px;
line-height: 1.6em;
width: 100%;
margin: 0;
margin-bottom: 20px;
padding: 5px 16px;
position: relative;
left: -16px;
top: 8px;
color: #ffffff;
text-shadow: 0 1px 1px #111;
border-top: 1px solid #45924A;
border-bottom: 1px solid #45924A;
background: #45924A;
background: linear-gradient(top, #383838 0%, #262626 100%);
border-radius: 2px 2px 0 0;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}
.ribbon h3::before,
.ribbon h3::after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
bottom: -11px;
z-index: -10;
border: 5px solid;
border-color: #242424 transparent transparent transparent;
}
.ribbon h3::before {
left: 0;
}
.ribbon h3::after {
right: 0;
}
.displayed {
display: block;
margin-left: auto;
margin-right: auto;
}
h4 {
text-align: center;
}
.greenText {
color: #45924A;
}
.brownText {
color: #C4A621;
}
.purpleText {
color: #A66ECA;
}
body {
font-family: "Open Sans", sans-serif;
}
.image-wrapper img {
max-width: 100% !important;
height: auto;
display: block;
}
&#13;
<div id="container">
<div id="header">
<div class="image-wrapper"><img src="https://dl.dropboxusercontent.com/u/98230963/iOUTLETBanner.png" alt="THE_iOUTLET" width="1000" height="370" /></div>
</div>
<div class="col3">
<div class="ribbon">
<h3>iPhone 6 Plus 16GB Space Grey - Vodafone/TalkTalk/Lebara</h3>
<div class="image-wrapper"><img class="displayed" src="https://dl.dropboxusercontent.com/u/98230963/5Ssealed/6Grey.jpg" alt="iPhone" width="600" height="360" /></div>
<table border="0px" align="center">
<tbody>
<tr>
<td><strong>Phone Rating:</strong></td>
<td>
<div class="image-wrapper"><img src="https://dl.dropboxusercontent.com/u/98230963/5Ssealed/5Stars.png" alt="Phone Rating" width="180" height="30" /></div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="col4">
<div class="ribbon">
<h3>What's included?</h3>
<ul>
<ul>
<li>iPhone 6 Plus 16GB Space Grey</li>
<li>12 Months Warranty</li>
<li>UK Version</li>
<li>Generic box</li>
<li>Generic USB Cable</li>
<li>iOS 8 Ready</li>
</ul>
</ul>
</div>
</div>
<div class="full">
<table border="0px" align="center">
<tbody>
<tr>
<td><img src="http://simplicitywebsitedesign.com/iOutlet/images/buttons/CustomerSatisfaction.png" alt="100% Customer Satisfaction" width="140" height="60" align="middle" />
<img src="http://simplicitywebsitedesign.com/iOutlet/images/buttons/PaypalVerified.png" alt="Paypal Verified" width="140" height="60" align="middle" />
<img src="http://simplicitywebsitedesign.com/iOutlet/images/buttons/FastDelivery.png" alt="Fast Delivery" width="140" height="60" align="middle" />
<img src="http://simplicitywebsitedesign.com/iOutlet/images/buttons/Recycled.png" alt="100% Recyled Pre-owned Products" width="140" height="60" align="middle" />
<img src="http://simplicitywebsitedesign.com/iOutlet/images/buttons/TopSellerRated.png" alt="Top Seller Rated" width="140" height="60" align="middle" />
<img src="http://simplicitywebsitedesign.com/iOutlet/images/buttons/PhoneSupport.png" alt="Phone Support" width="140" height="60" align="middle" /></td>
</tr>
</tbody>
</table>
<div class="ribbon">
<h3 align="center">Description</h3>
<div align="center">
<div>
<div>
<p align="center"><span style="color: #00429a; font-size: x-large;"><b><span class="Apple-style-span" style="font-family: Impact;">THIS PHONE IS LOCKED to Vodafone UK. Therefore it will only work using an </span>Vodafone/TalkTalk/Lebara <span style="font-family: Impact;">Sim card</span></b>
</span>
</p>
<p align="center"><b style="color: #003162; font-family: Impact;"> </b></p>
<p align="center"><b style="color: #003162; font-family: Impact;"> </b></p>
<b>Handsets and accessories as listed only. This item has been opened and activated to check functionality.</b>
</div>
<div><b> </b></div>
<div><b> All are as will come repackaged in generic box. All phones are 100% original. Why pay new prices when you can have grade A for a fraction.</b></div>
<div><b> </b></div>
<div><b>All phones will come with 12 month warranty</b></div>
<div></div>
<div><span class="Apple-style-span" style="color: #00429a;">We are a UK based large seller of iPhones, please check us out on the internet and buy with confidence.</span></div>
<div><span class="Apple-style-span" style="color: #00429a;"> </span></div>
<div><span class="Apple-style-span" style="color: #00429a;"> </span></div>
<div><span class="Apple-style-span" style="color: #00429a;">iPhone 6 plus spec:</span></div>
<div><span class="Apple-style-span" style="color: #00429a;"><span class="Apple-style-span" style="color: #00429a;"><span class="Apple-style-span" style="font-family: Karla, sans-serif; font-size: 13px;">
</span></span>
</span>
<div class="key display" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% 0%;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">Display</h4> 5.50-inch
</div>
<div class="key processor" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -42px;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">Processor</h4> Apple A8
</div>
<div class="key frontcam" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -84px;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">Front Camera</h4> 1.2-megapixel
</div>
<div class="key resolution" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -126px;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">Resolution</h4> 1080x1920 pixels
</div>
<div class="key ram" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -167px;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">RAM</h4> 1GB
</div>
<div class="key os" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -208px;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">OS</h4> iOS 8.0
</div>
<div class="key storage" style="outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -251px;">
<h4 style="color: #4b4b4b; outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">Storage</h4> 16
<span style="color: #4b4b4b;">GB</span>
</div>
<div class="key rearcam" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -83px;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">Rear Camera</h4> 8-megapixel
</div>
<div class="key battery" style="color: #4b4b4b; outline: none; float: left; font-weight: bold; line-height: 18px; margin-bottom: 20px; padding-left: 40px; width: 113px; background-position: 0% -334px;">
<h4 style="outline: none; margin: 0px 0px 5px; padding: 0px; font-weight: normal !important;">Battery capacity</h4> 2915mAh
</div>
</div>
<div><span class="Apple-style-span" style="color: #00429a;"> </span></div>
<div><span class="Apple-style-span" style="color: #00429a;"> </span></div>
<div><span class="Apple-style-span" style="color: #00429a;"> </span></div>
<div><span class="Apple-style-span" style="color: #00429a;"> </span></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div>This model has 16GB storage</div>
</div>
<div align="center">
<p style="text-align: center; margin: 7px;" align="center"><strong><span class="Apple-style-span" style="font-family: 'Arial Black';"> </span></strong></p>
<p style="text-align: center; margin: 7px;" align="center"><span class="Apple-style-span" style="font-family: 'Arial Black';"><b> </b></span></p>
<p style="text-align: center; margin: 7px;" align="center"><span class="Apple-style-span" style="color: #00456d; font-family: Impact; font-size: large;"><span class="Apple-style-span" style="line-height: normal;"><b> </b></span></span>
</p>
<div style="font-family: 'Arial Black'; text-align: center;"><strong style="font-weight: bold;"><strong style="font-weight: bold;"><span style="font-family: Arial Black;">
</span></strong></strong>
<p style="text-align: center; display: inline !important; margin: 7px;" align="left"></p>
<b> </b>
<p style="font-weight: bold; text-align: center; margin: 7px;" align="center"><span style="color: #ff0010; font-family: Arial; font-size: 18pt;"><span style="color: #000000; font-size: small;"><strong><span style="color: #00ae5f;"><span style="color: #000000; font-family: Arial Black; font-size: medium;"><span style="font-size: x-large;"> </span></span>
</span>
</strong>
</span>
</span>
</p>
<p style="text-align: center; margin: 7px;" align="center"><span class="Apple-style-span" style="color: #000000; font-size: x-large;"><span class="Apple-style-span" style="font-weight: 800;"> </span></span>
</p>
</div>
</div>
</div>
<div align="center"><strong><strong><span style="font-family: Arial Black;">
</span></strong></strong>
<div style="text-align: center;"></div>
</div>
</div>
</div>
</div>
<div class="col2">
<div class="ribbon">
<h3>Why buy from THE_iOUTLET?</h3>
<ul>
<li>All iPhones are fully tested and in perfect working order.</li>
<li>We post Special Delivery for FREE so you get it the next day where possible.</li>
</ul>
</div>
</div>
<div class="full">
<div class="image-wrapper"><img src="https://dl.dropboxusercontent.com/u/98230963/Footer2.png" alt="THE_iOUTLET" width="1000" height="251" /></div>
</div>
&#13;
2) 另外,你能告诉我为什么绿色图标(https://snag.gy/nqMHpf.jpg)在实际网站上垂直显示?我注意到在这里提供的代码片段和jsfiddler中,它们按照我的意愿水平显示。但是在Firefox中查看它们时,它们位于下一个上方。
答案 0 :(得分:0)
您的容器宽度设置为静态金额 - width:920px
,但它只是隐藏了溢出的内容。因此,每当您减小屏幕尺寸时 - 您的容器宽度不会低于该容器宽度,因此您的图像仍然适合该容器。
修改:您的.col3
也有设定的宽度。