DIV 可以定义块（也就是一段内容），CSS 可以定义样式，我们可以让不同的 DIV 应用不同的 CSS，以此来进行网页的布局
<html><body><style> ???# 定义一个样式A.A { ???background-color:gray; ???color:white;}</style><style> ???# 定义一个样式B.B { ???background-color:gray; ???color:black;}</style><div class="A"> ???# 这个div应用样式A<h2>London is the capital city of England. </h2></div><div class="B"> ???# 这个div应用样式B<h2>London is the capital city of England. </h2></div></html></body>效果：
实践：使用 DIV + CSS 来进行布局
<!DOCTYPE html><html><head><style> ????# 先定义好CSS（即样式）#header { ???background-color:black; ???color:white; ???text-align:center; ???padding:5px;}#nav { ???line-height:30px; ???background-color:#eeeeee; ???height:300px; ???width:100px; ???float:left; ???padding:5px; ?????????}#section { ???width:350px; ???float:left; ???padding:10px; ?????????}#footer { ???background-color:black; ???color:white; ???clear:both; ???text-align:center; ??padding:5px; ?????????}</style></head><body><div id="header"> ?????????# 不同的div应用不同的css <h1>City Gallery</h1></div><div id="nav">London<br>Paris<br>Tokyo<br></div><div id="section"><h2>London</h2><p>London is the capital city of England. It is the most populous city in the United Kingdom,with a metropolitan area of over 13 million inhabitants.</p><p>Standing on the River Thames, London has been a major settlement for two millennia,its history going back to its founding by the Romans, who named it Londinium.</p></div><div id="footer">Copyright ? W3Schools.com</div></body></html>效果图：
HTML DIV+CSS
原文地址：https://www.cnblogs.com/pzk7788/p/8213288.html