代码

<!DOCTYPE html>
<html id="index-page" class="canvas canvastext no-touch draganddrop rgba borderradius boxshadow textshadow opacity fontface video audio localstorage mobile-768 mozilla wordpress-section w-900 lt-960 js gradient rgba opacity textshadow multiplebgs boxshadow borderimage borderradius no-cssreflections csstransforms csstransitions fontface not-ie domloaded" lang="en-US" dir="ltr">
<head>
<body id="home" class="home blog">
<div id="wrap" style="">
<header role="banner">
<section id="site-logo">
<a href="http://ackmaster.com/wordpress">
<img width="1200px" alt="Ackmaster.com" src="http://ackmaster.com/wordpress/wp-content/uploads/2011/12/WebSiteMain2.jpg">
</a>
</section>
<section id="nav-wrap">
</header>
<div id="content" role="main">
<footer style="min-height: 0; padding-top: 0;" role="contentinfo">
</div>
<script>
<div id="fancybox-tmp"></div>
<div id="fancybox-loading">
<div id="fancybox-overlay"></div>
<div id="fancybox-wrap">
</body>
</html>

Answer 1

您可以将图片宽度设置为100％＆gt;

<img width="100%" alt="Ackmaster.com" src="http://ackmaster.com/wordpress/wp-content/uploads/2011/12/WebSiteMain2.jpg">

或：

<img style="width:100%" alt="Ackmaster.com" src="http://ackmaster.com/wordpress/wp-content/uploads/2011/12/WebSiteMain2.jpg">

祝你好运！

Answer 2

子节点只能与其父节点一样大。确保父节点足够大以容纳子节点。 div只有900px，但图像是1200px。这就是问题所在。

Answer 3

如何使用CSS：

#site-logo{
    width:1200px;
} 
#site-logo img{
    overflow:hidden;
}

Answer 4

我使用FF检查了您的网址，按照您的预期进行了更改。

img {
    border: 0 none;
    vertical-align: middle;
    width: 100%;
}

select#mobile-navigation  {
    color: #1F1F1F;
    float: left;
}

#nav-wrap div.bg {
    -moz-box-shadow: 0 3px 0 rgba(55, 55, 55, 0.12);
    background: url("../images/common-bg.jpg") repeat scroll 0 0 transparent;
    height: 49px;
    left: -40px;
    padding: 0 57px;
    position: absolute;
    top: 0;
    width: 97%;
}

溢出隐藏的图像

代码

4 个答案: