Html學習筆記(2)
阿新 • • 發佈:2018-11-02
瞭解標籤
<em>
表示強調,在瀏覽器中以斜體顯示;<strong>
比<em>
語氣更強,以粗體顯示;<span>
沒有意義,目的是為了單獨設定樣式,例如
<span style="color:blue">美國夢</span>
,設定美國夢的字型顏色為藍色;<q>
表示短引用,瀏覽器自動對引用的文字加雙引號<blockquote>
表示長引用,瀏覽器對引用文字採取縮排樣式;<br/>
標籤分行顯示文字,在需要回車的地方輸入,html語言自動忽略空格和回車;
表示輸入一個空格,不要忘記了那個分號;<hr>
或<hr/>
表示新增水平橫線,由於是空標籤,所以只有開始標籤沒有結束標籤,線條的顏色和粗細用CSS修改;<address>
中的內容表示地址,簽名等,預設為斜體,可以使用css修改樣式;<code>
標籤表示插入一行程式碼,注意不能是多行<pre>
表示插入程式碼塊,被包圍在 pre 元素中的文字通常會保留空格和換行符。<ul>-<li>
新增資訊列表,ul-li是沒有前後順序的資訊列表。語法:<ul
ul-li在網頁中顯示的預設樣式一般為:每項li前都自帶一個圓點
<ol>
表示有序列表,語法如下:<ol> <li>資訊</li> <li>資訊</li> ...... </ol>
每項list之前自動新增序號1,2,3。。。
<div>
標籤相當於一個容器,劃分出獨立的邏輯部分。為了使邏輯更加清晰,我們可以為這一個獨立的邏輯部分設定一個名稱,用id屬性來為<div>
<div id="版塊名稱">...</div>
;<table>
標籤顯示網頁上的表格,例如:
<table>
<tbody>
<tr>
<th>班級</th>
<th>學生數</th>
<th>平均成績</th>
</tr>
<tr>
<td>一班</td>
<td>30</td>
<td>89</td>
</tr>
<tr>
<td>二班</td>
<td>35</td>
<td>85</td>
</tr>
<tr>
<td>三班</td>
<td>32</td>
<td>80</td>
</tr>
</tbody>
</table>
其中包含幾類標籤,
<table>...</table>
標記表格的內容;<tbody>...</tbody>
當表格內容非常多時,表格會下載一點顯示一點,但如果加上標籤後,這個表格就要等表格內容全部下載完才會顯示;<tr>
表格的一行<th>
代表表頭<td>
表示一個單元格,意味著一列
備註:
- table表格在沒有新增css樣式之前,在瀏覽器中顯示是沒有表格線的
- 表頭,也就是th標籤中的文字預設為粗體並且居中顯示
在<head>
標籤中新增css樣式,可以修改表格的邊框,例如:
<style type="text/css">
table tr td,th{border:1px solid #000;}
</style>
表示為表格新增粗細為一個畫素的黑色邊框。
<caption>
標籤為表格新增標題,用以描述表格內容,標題的顯示位置:表格上方。- 表格的summary屬性為摘要,摘要的內容是不會在瀏覽器中顯示出來的。它的作用是增加表格的可讀性(語義化),使搜尋引擎更好的讀懂表格內容,還可以使螢幕閱讀器更好的幫助特殊使用者讀取表格內容。