<divclass="city"><h2>London</h2><p>London is the capital city of England.</p><p>It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.
</p></div>
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>13.响应式web设计</title><styletype="text/css">.city{/*排版部分模块命名为 city .标识使用class选择器*/float: left;margin: 5px;/*margin 修改页边距*/padding: 15px;/*padding 页边框与页面内容的距离*/width: 300px;height: 300px;/*边框的尺寸*/border: 1px solid black;}</style></head><body><!--RWD responsive web design 响应式web程序设计--><h3>W3Schools Demo</h3><h4>Resize this responsive page!</h4><divclass="city"><!--选择相应的选择器标识的排版模块--><h2>London</h2><p>London is the capital city of England.</p><p>It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.
</p></div><divclass="city"><h2>Paris</h2><p>Paris is the capital and most populous city of France.</p></div><divclass="city"><h2>Tokyo</h2><p>Tokyo is the capital of Japan, the center
of the Greater Tokyo Area, and the most
populous metropolitan area in the world.
</p></div></body></html>
html 响应式设计1. 响应式设计响应式Web设计(Responsive Web Design)RWD 能够以可变尺寸传递网页2. 简单的响应式设计1. 网页效果2. 设计分析文字部分边框外的文字设定标题级别即可边框内的文字有标题和普通文本排版部分本文的重点部分在于CSS排版,主要有以下几个关键部分边框尺寸及如何显示页边空白:边框之间的距离内边距:边框与本文内容之间的距离整合部分整合部分主要是html文本与css排版的整合,用以下三个工具进行衔接