设计人员要求两列内容区域布局,左侧列为图像,右侧为文本,第一张图像下方为全宽报价.
客户端将在此CMS驱动的站点中输入内容,因此列需要根据需要垂直扩展.真实网站上没有背景颜色,因此列不需要相等的高度.
<div class="container">
<div class="top-left">Picture here</div>
<div class="full-width">
<blockquote>Blockquote here</blockquote>
</div>
<div class="bottom-left">Picture here</div>
<div class="top-right">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
</div>
</div>
.container …