html比较难记的点
生活随笔
收集整理的這篇文章主要介紹了
html比较难记的点
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
網頁布局:
table方式
<!DOCTYPE html> <html> <body><table width="500" border="0"> //寬度500 邊界為0 <tr> <td colspan="2" style="background-color:#99bbbb;"> //colspan 和并列 <h1>網頁主標題</h1> </td> //列開頭 </tr> //行開頭<tr valign="top"> //valign 垂直對齊 <td style="background-color:#ffff99;width:100px;text-align:top;"> //設置列樣式 <b>菜單</b><br /> HTML<br /> CSS<br /> JavaScript </td> <td style="background-color:#EEEEEE;height:200px;width:400px;text-align:top;"> 內容都在這里</td> </tr><tr> <td colspan="2" style="background-color:#99bbbb;text-align:center;"> //和并列 我是底部標簽</td> </tr> </table></body> //width 寬度 height 高度 align排列 top頂部 background背景 </html>
<!DOCTYPE html> <html> <head>//div標-可定義文檔中的分區或節(division/section)。 <div> 標簽可以把文檔分割為獨立的、不同的部分。它可以用作嚴格的組織工具,并且不使用任何格式與其關聯。 如果用 id 或 class 來標記 <div>,那么該標簽的作用會變得更加有效。 簽 <style type="text/css">//樣式類型--> div#container{width:500px} //容器寬度 布局箱子寬度 float浮動--> div#header {background-color:#99bbbb;}//定義頁眉屬性 div#menu {background-color:#ffff99; height:200px; width:100px; float:left;} 定義菜單屬 div#content {background-color:#EEEEEE; height:200px; width:400px; float:left;} 定義內容屬性 div#footer {background-color:#99bbbb; clear:both; text-align:center;} //頁腳 h1 {margin-bottom:0;} h2 {margin-bottom:0; font-size:14px;} //定義下邊距 字號--> ul {margin:0;} //定義邊緣--> li {list-style:none;}//列表式--> </style> </head><body><div id="container"><div id="header"> <h1>Main Title of Web Page</h1> </div><div id="menu"> <h2>Menu</h2> <ul> <li>HTML</li> <li>CSS</li> <li>JavaScript</li> </ul> </div><div id="content">Content goes here</div><div id="footer">Copyright W3School.com.cn</div></div></body> </html>
table方式
<!DOCTYPE html> <html> <body><table width="500" border="0"> //寬度500 邊界為0 <tr> <td colspan="2" style="background-color:#99bbbb;"> //colspan 和并列 <h1>網頁主標題</h1> </td> //列開頭 </tr> //行開頭<tr valign="top"> //valign 垂直對齊 <td style="background-color:#ffff99;width:100px;text-align:top;"> //設置列樣式 <b>菜單</b><br /> HTML<br /> CSS<br /> JavaScript </td> <td style="background-color:#EEEEEE;height:200px;width:400px;text-align:top;"> 內容都在這里</td> </tr><tr> <td colspan="2" style="background-color:#99bbbb;text-align:center;"> //和并列 我是底部標簽</td> </tr> </table></body> //width 寬度 height 高度 align排列 top頂部 background背景 </html>
<!DOCTYPE html> <html> <head>//div標-可定義文檔中的分區或節(division/section)。 <div> 標簽可以把文檔分割為獨立的、不同的部分。它可以用作嚴格的組織工具,并且不使用任何格式與其關聯。 如果用 id 或 class 來標記 <div>,那么該標簽的作用會變得更加有效。 簽 <style type="text/css">//樣式類型--> div#container{width:500px} //容器寬度 布局箱子寬度 float浮動--> div#header {background-color:#99bbbb;}//定義頁眉屬性 div#menu {background-color:#ffff99; height:200px; width:100px; float:left;} 定義菜單屬 div#content {background-color:#EEEEEE; height:200px; width:400px; float:left;} 定義內容屬性 div#footer {background-color:#99bbbb; clear:both; text-align:center;} //頁腳 h1 {margin-bottom:0;} h2 {margin-bottom:0; font-size:14px;} //定義下邊距 字號--> ul {margin:0;} //定義邊緣--> li {list-style:none;}//列表式--> </style> </head><body><div id="container"><div id="header"> <h1>Main Title of Web Page</h1> </div><div id="menu"> <h2>Menu</h2> <ul> <li>HTML</li> <li>CSS</li> <li>JavaScript</li> </ul> </div><div id="content">Content goes here</div><div id="footer">Copyright W3School.com.cn</div></div></body> </html>
轉載于:https://www.cnblogs.com/aix1314/archive/2013/05/17/3084195.html
總結
以上是生活随笔為你收集整理的html比较难记的点的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: JavaScript六种继承方式的递进推
- 下一篇: 终于明白如何去写原生AJAX