在上图中,标题顶部添加了一个边距。在Css填充顶部是10 px但由于某些未知的原因,边距高于帖子标题。其中写有“适当协同......”
HTML
<div id="featued" class="site-featured">
<div class="featured-image"><img src="images/featured-image.jpg"></img></div>
<div class="featured-title">
Appropriately synergize cross-media applications for frictionless meta-services
</div>
<p class="featured-body">
Completely foster interdependent growth strategies with leading-edge methods of empowerment. Dramatically fashion end-to-end total linkage before real-time partnerships. Uniquely develop sustainable materials whereas web-enabled resources. Progressively incubate pandemic web-readiness after exceptional synergy. Enthusiastically exploit client-focused imperatives rather than premier communities.
Progressively target bleeding-edge imperatives and enterprise strategic theme areas. Distinctively simplify out-of-the-box strategic theme areas for user-centric deliverables. Compellingly aggregate high-payoff ROI vis-a-vis distributed portals. Competently productivate covalent e-services before just in time infrastructures. Monotonectally fabricate orthogonal innovation vis-a-vis focused leadership.
</p>
</div>
CSS代码:
.site-featured{
background-color: #79a6b2;
margin-top: 20px;
padding: 10px 15px 10px 15px;
height: 268px;
color: #fff;
}
.featured-title{
font-size: 30px;
}
.site-featured .featured-image{
margin-right: 15px;
float: left;
}
注意: - 我已经在使用Reset.css
其他屏幕截图更清晰:
答案 0 :(得分:0)
默认情况下,brower会为标签添加一些边距和填充,因此最好使用任何css CSS工具:重置CSS meyerweb
希望它会帮助你
.featured-title {
display: flex;
}