html基本知识

最新推荐文章于 2021-12-10 22:58:47 发布

原创最新推荐文章于 2021-12-10 22:58:47 发布 · 362 阅读

0 ·

CC 4.0 BY-SA版权

前端专栏收录该内容

6 篇文章

订阅专栏

<h1>...<h6> 一级到六级标题
<p> 段落标签
<br/> 换行标签
<hr/> 水平线标签
<strong> 粗体
<em> 文字倾斜

特殊符号	字符实体
空格	` `
大于号	`>`
小于号	`<`
引号	`"`
版权符号	`©`

<img src="图片路径" alt="图片加载不出来替换文字" title="鼠标放到图片上显示文字"/>
<a href="链接地址" target="目标窗口位置">点我</a>
target 取值 _self 本窗口打开 _blank 新窗口打开 `

超链接的应用场合：
页面链接（从A页面到B页面），锚链接（A页面甲位置到A页面乙位置），功能性链接（在页面调用其他程序功能）

锚链接示例代码：

<a href="#martin">martin</a>
<h1><a name="martin">hahahhah</a> </h1>
<h2><a name="duan">duan</a></h2>

列表

无序列表

<ul>
    <li>第1项</li>
    <li>第2项</li>
    <li>第3项</li>
</ul>

有序列表

<ol>
    <li>第1项</li>
    <li>第2项</li>
    <li>第3项</li>
</ol>

定义列表

<dl>
    <dt>标题一</dt>
    <dd>第1项</dd>
    <dd>第2项</dd>
    <dd>第3项</dd>
    <dt>标题二</dt>
    <dd>第1项</dd>
    <dd>第二项</dd>
</dl>

表格

<table border="2">
    <tr>
        <th>1行1列的标题</th>
        <th>1行2列的标题</th>
        <th>1行3列的标题</th>
    </tr>
    <tr>
        <td>1 row 1 columns</td>
        <td>1 row 2 columns</td>
        <td>1 row 3 columns</td>
    </tr>
    <tr>
        <td>2 row 1 columns</td>
        <td>2 row 2 columns</td>
        <td>2 row 3 columns</td>
    </tr>
</table>

跨行和跨列表格

<table border="2">
    <tr>
        <th>1行1列的标题</th>
        <th>1行2列的标题</th>
        <th>1行3列的标题</th>
    </tr>
    <tr>
        <td colspan="2">1 row 1 columns</td>
        <td rowspan="2">1 row 2 columns</td>
        <!--<td>1 row 3 columns</td>-->
    </tr>
    <tr>
        <td>2 row 1 columns</td>
        <td>2 row 2 columns</td>
    </tr>
</table>

媒体元素

<video controls>
    <source src="video.mp4">
</video>

<audio controls>
    <source src="video.mp4">
</audio>

html5中的结构元素	说明
`header`	头部区域
`footer`	脚部区域
`section`	web页面中的一个独立区域
`article`	独立的文章内容
`aside`	相关内容或应用
`nav`	导航类辅助内容