CSS標簽有哪些及怎么用

這篇文章主要介紹了CSS標簽有哪些及怎么用的相關知識，內容詳細易懂，操作簡單快捷，具有一定借鑒價值，相信大家閱讀完這篇CSS標簽有哪些及怎么用文章都會有所收獲，下面我們一起來看看吧。

1，無序列表

ul-li是沒有前后順序的信息列表。

語法：

<ul>

<li>信息</li>

<li>信息</li>

......

</ul>

舉例：

<ul>

<li>精彩少年</li>

<li>美麗突然出現</li>

<li>觸動心靈的旋律</li>

</ul>

ul-li在網頁中顯示的默認樣式一般為：每項li前都自帶一個圓點

2,有序列表

語法：

<ol>

<li>信息</li>

<li>信息</li>

......

</ol>

舉例：

下面是一個熱點課程下載排行榜：

<ol>

<li>前端開發面試心法 </li>

<li>零基礎學習html</li>

<li>JavaScript全攻略</li>

</ol>

<ol>在網頁中顯示的默認樣式一般為：每項<li>前都自帶一個序號，序號默認從1開

<div>容器標簽

在網頁制作過程過中，可以把一些獨立的邏輯部分劃分出來，放在一個<div>標簽中，這個<div>標簽的作用就相當于一個容器。

語法：

<div>&hellip;</div>

確定邏輯部分：

什么是邏輯部分？它是頁面上相互關聯的一組元素。如網頁中的獨立的欄目版塊，就是一個典型的邏輯部分。如下圖所示：圖中用紅色邊框標出的部分就是一個邏輯部分，就可以使用<div>標簽作為容器

注釋：<div> 是一個塊級元素，也就是說，瀏覽器通常會在 div 元素前后放置一個換行符。

創建表格的五個元素：

table、tbody、tr、th、td

1、<table>&hellip;</table>：整個表格以<table>標記開始、</table>標記結束。

2、<tbody>&hellip;</tbody>：當表格內容非常多時，表格會下載一點顯示一點，但如果加上<tbody>標簽后，這個表格就要等表格內容全部下載完才會顯示。如右側代碼編輯器中的代碼。（這個標簽基本上不怎么用了）

3、<tr>&hellip;</tr>：表格的一行，所以有幾對tr 表格就有幾行。

4、<td>&hellip;</td>：表格的一個單元格，一行中包含幾對<td>...<td/>，說明一行中就有幾列。

5、<th>&hellip;</th>：表格的頭部的一個單元格，表格表頭。

6、表格中列的個數，取決于一行中數據單元格的個數。

表格還是需要添加一些標簽進行優化，可以添加標題和摘要

<table summary="本表格記錄2012年到2013年庫存記錄，記錄包括U盤和耳機庫存量">

<caption>2012年到2013年庫存記錄</caption>

1，使用<a>標簽，鏈接到別一個頁面

使用<a>標簽可實現超鏈接，它在網頁制作中可以說是無處不在，只要有鏈接的地方，就會有這個標簽。

語法：

<a href=”目標網址”>鏈接顯示的文本</a>

例如：

<a href = "http://www.imooc.com">click here!</a>

上面例子作用是單擊click here!文字，網頁鏈接到http://www.imooc.com這個網頁。

認識<img>標簽，為網頁插入圖片

在網頁的制作中為使網頁炫麗美觀，肯定是缺少不了圖片，可以使用<img>標簽來插入圖片。

語法：

<img src="圖片地址" alt="下載失敗時的替換文本" title = "提示文本">

舉例：

<img src = "myimage.gif" alt = "My Image" title = "My Image" />

講解：

1、src：標識圖像的位置；

2、alt：指定圖像的描述性文本，當圖像不可見時（下載不成功時），可看到該屬性指定的文本；

3、title：提供在圖像可見時對圖像的描述(鼠標滑過圖片時顯示的文本)；

4、圖像可以是GIF，PNG，JPEG格式的圖像文件。

關于“CSS標簽有哪些及怎么用”這篇文章的內容就介紹到這里，感謝各位的閱讀！相信大家對“CSS標簽有哪些及怎么用”知識都有一定的了解，大家如果還想學習更多知識，歡迎關注億速云行業資訊頻道。