HTML的一些標簽

-Advertisement-

HTML 一、認識HTML 什麼是HTML？ HTML 是用來描述網頁的一種語言 HTML 指的是超文本標記語言: HyperText Markup Language HTML 不是一種編程語言，而是一種標記語言標記語言是一套標記標簽 (markup tag) HTML 使用標記標簽來描述網頁 H ...

HTML

一、認識HTML

什麼是HTML？

HTML 是用來描述網頁的一種語言
HTML 指的是超文本標記語言: HyperText Markup Language
HTML 不是一種編程語言，而是一種標記語言
標記語言是一套標記標簽 (markup tag)
HTML 使用標記標簽來描述網頁
HTML 文檔包含了HTML 標簽及文本內容
HTML文檔也叫做 web 頁面

註意：html是不區分大小寫的，習慣用小寫

二、HTML標簽

1.基礎標簽

<h1> - <h6> 標簽可定義標題。<h1> 定義最大的標題。<h6> 定義最小的標題
段落是通過標簽 <p> 來定義的

2.圖片、音頻、視頻標簽

<img>定義圖片

實例 ：<img src="/images/logo.png" width="258" height="39" />

<video>定義視頻
<audio>定義音頻

註意：根據圖片與代碼的保存位置寫訪問路徑（如圖）

3、超鏈接標簽

<a> 標簽定義超鏈接，用於從一張頁面鏈接到另一張頁面。

href:指定訪問資源的URL
target:指定打開資源的方式

4、列表標簽

有序列表（order list)

<ol type="A">
    <li>咖啡</li>
    <li>茶</li>
    <li>水</li>
</ol>

無序列表（unorder list）

<ul>
    <li>咖啡</li>
    <li>茶</li>
    <li>水</li>
</ul>

運行結果

5、表格標簽

<table>定義表格
<tr>定義行
<th>定義表頭單元格
<td>定義單元格

案例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table border="1"cellspacing="0"width="500">
    <tr>
        <th>序號</th>
        <th>品牌</th>
        <th>品牌名稱</th>
        <th>企業名稱</th>
    </tr>
    <tr align="center">
        <td>010</td>
        <td><img src="../img/三隻松鼠.png" width="60" height="50" ></td>
        <td>三隻松鼠</td>
        <td>三隻松鼠</td>
    </tr >
    <tr align="center">
        <td>009</td>
        <td><img src="../img/優衣庫.png" width="60" height="50"> </td>
        <td>優衣庫</td>
        <td>優衣庫</td>
    </tr>
    <tr align="center">
        <td>009</td>
        <td><img src="../img/小米.png" width="60" height="50" ></td>
        <td>小米科技有限公司</td>
        <td>小米科技有限公司</td>
    </tr>
</table>

<hr>
<table border="1"cellspacing="0"width="500">
    <tr>
        <th colspan="2">序號</th>
        <th>品牌</th>
        <th>品牌名稱</th>
        <th>企業名稱</th>
    </tr>
    <tr align="center">
        <td>010</td>
        <td><img src="../img/三隻松鼠.png" width="60" height="50" ></td>
        <td>三隻松鼠</td>
        <td>三隻松鼠</td>
    </tr >
    <tr align="center">
        <td>009</td>
        <td><img src="../img/優衣庫.png" width="60" height="50"> </td>
        <td>優衣庫</td>
        <td>優衣庫</td>
    </tr>
    <tr align="center">
        <td>009</td>
        <td><img src="../img/小米.png" width="60" height="50" ></td>
        <td>小米科技有限公司</td>
        <td>小米科技有限公司</td>
    </tr>
</table>
</body>
</html>

6、佈局標簽

<div>定義HTML文檔中的區域部分，與CSS一起使用
<span>用於組合行內元素

7、表單標簽

<input>:表單項
<select>:定義下拉列表
<tsxtarea>文本域

您的分享是我們最大的動力!

-Advertisement-

更多相關文章

Redis SCAN命令

1. 獲取指定首碼的key 需求描述： Redis中有大量以xxx開頭的key，在不使用keys命令的情況下，如何快速獲取這些首碼的key 解決方案： redis自帶的scan命令可以解決這個問題 2. SCAN命令 SCAN是一個基於游標的迭代器。這意味著在每次調用該命令時，伺服器都會返回一個更新 ...
MySQL擴展

1、行轉列源數據：目標數據：數據準備 -- 建表插入數據 drop table if exists time_temp; create table if not exists time_temp( `year_col` int not null comment '年份', `month_col ...
開源項目丨Taier1.2版本發佈，新增工作流、租戶綁定簡化等多項功能

2022年7月26日，Taier1.2版本正式發佈！本次版本發佈更新功能：新增工作流新增OceanBase SQL 新增Flink jar任務數據同步、實時採集支持臟數據管理 Hive UDF 控制台UI升級租戶綁定簡化新版本的使用文檔已在社區中推送，大家可以隨時下載查閱，歡迎大家體驗新 ...
Sql server還原失敗(資料庫正在使用,無法獲得對資料庫的獨占訪問權)

現如今 Redis 變得越來越流行，幾乎在很多項目中都要被用到，不知道你在使用 Redis 時，有沒有思考過，Redis 到底是如何穩定、高性能地提供服務的？我使用 Redis 的場景很簡單，只使用單機版 Redis 會有什麼問題嗎？我的 Redis 故障宕機了，數據丟失了怎麼辦？如何能保證我的... ...
mysql實戰案例

實戰案例 1.搭建mysql服務下載mysql [root@localhost ~]# wget http://dev.mysql.com/get/mysql57-community-release-el7-11.noarch.rpm [root@localhost ~]# rpm -Uvh my ...
Android學習筆記——四大組件

四大組件 Activity 實現步驟繼承 Activity 或其子類，實現以下方法： //第一次創建時回調 protected void onCreate(Bundle savedInstanceState); //啟動時回調 protected void onStart(); //再次啟動時回調 ...
iOS中 Tagged Pointer 技術

前言：從64位開始，iOS引入了Tagged Pointer技術，用於優化NSNumber、NSDate、NSString等小對象的存儲。 Tagged Pointer主要為瞭解決兩個問題：記憶體資源浪費，堆區需要額外的開闢空間訪問效率,每次set/get都需要訪問堆區,浪費時間, 而且需要 ...
虛擬偶像的歌聲原來是這樣生成的！

HMS Core音頻編輯服務（Audio Editor Kit）6.6.0版本上線，新增歌聲合成能力。通過歌詞和曲調，結合不同的曲風讓機器也能生成真實度極高的歌聲。支持字級別輸入歌詞進行音素轉換，生成對應歌詞的歌聲，可靈活調整音高、滑音、呼吸音、顫音等細節參數，讓歌聲更真實。歌聲合成服務可廣泛應用 ...