HTML学习——HTML布局

2024-11-03 10:25:02

1、新建Notepad并打开

HTML学习——HTML布局HTML学习——HTML布局

2、使用 <div> 元素的 HTML 布局

HTML学习——HTML布局

3、页眉#hea蟠校盯昂der{ background-color:black; color:white; text-align:center; padding:6px;}

HTML学习——HTML布局

4、左侧导航条#nav{ line-height:50px; backgrun蟠校盯昂d-color:gray; height:300px; width:100px; float:left; padding:8px;}

HTML学习——HTML布局

5、右侧正文#section{ width:350px; float:left; padding:5px;}

HTML学习——HTML布局

6、页脚#footer{ background-color:black; color:white; clear:both; text-align:centet; padding:5px;}

HTML学习——HTML布局

7、另存为HTML格式到桌面

HTML学习——HTML布局HTML学习——HTML布局

8、打开HTML桌面生成的网页

HTML学习——HTML布局
猜你喜欢