首页 > 其他分享> > HTML（学习笔记）不定期更新~

HTML（学习笔记）不定期更新~

2021-09-01 15:01:47 作者：互联网

HTML 超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言您可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析 Web标准 结构（HTML）、表现（CSS）、行为（JavaScript） lang语言种类 用来定义当前文档显示的语言 en #英语 zh-CN #中文例：<html lang="en"> HTML 属性 HTML 元素可以设置属性属性可以在元素中添加附加信息属性一般描述于开始标签属性总是以名称/值对的形式出现，比如：name="value" 注释 HTML中的注释以  结束路径相对路径

绝对路径是指目录下的绝对位置，直接到达目标位置，通常是从盘符开始的路径路径符号为反斜杠\

水平线 <hr> 标签在 HTML 页面中创建水平线换行换行 <br> 标签 特殊字符

标题标签 标题（Heading）是通过 <h1> - <h6> 标签进行定义的 <h1> 定义最大的标题。 <h6> 定义最小的标题 段落标签 段落是通过 <p> 标签定义的浏览器会自动地在段落的前后添加空行 文本格式化标签 <div>和<span>标签 <div> 和 <span>是没有语义的，它们就是一个盒子，是用来装内容的 <div>标签用来布局，属于大盒子 <span>也是用来布局，一行上可以放多个，属于小盒子 图像标签 <img src="boat.gif" alt="Big Boat"> height（高度）与 width（宽度）属性用于设置图像的高度与宽度，若不想图片变形，设置其中一个即可，即会等比例缩放

链接标签 <a> 标签 <a href="http://www.runoob.com" target="_blank">访问菜鸟教程！</a> target属性值

链接分类 1.外部链接：例如<a href="http://www.baidu.com">百度</a> 2.内部链接：网站内部页面之间的相互链接，直接链接内部页面名称即可，例如< a href="index html">首页</a> 3.空链接：如果当时没有确定链接目标时,< a href="#">首页</a> 4.下载链接：如果href里面地址是一个文件或者压缩包，会下载这个文件 5.网页元素链接：在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接 6.锚点链接：点击链接可以快速定位到页面中的某个位置在链接文本的href属性中，设置属性值为#名字的形式，如：< a href="#two">第2集</a> 找到目标位置标签，里面添加个id属性=刚才的名字，如：<h3 id="two">第2集介绍</h3> 注意：阻止链接跳转添加 javascript:void(0); 或者 javascript:; 例如：<a href="javascript:;" ></a> 表格标签 表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义）。字母 td 指表格数据（table data），即数据单元格的内容表格表头表格的表头使用 <th> 标签进行定义

<table border="1">
    <tr>
        <th>Header 1</th>
        <th>Header 2</th>
    </tr>
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>

表格属性

表格结构标签 <thead>标签表格的头部区域、<tbody>标签表格的主体区域合并单元格跨行合并：rowspan="合并单元格的个数" 最上侧单元格为目标单元格，写合并代码，并删除多余的单元格跨列合并：colspan="合并单元格的个数" 最左侧单元格为目标单元格，写合并代码，并删除多余的单元格

<table width="500" height="250" border="1" cellspacing="0">
    <tr>
        <td></td>
        <td colspan="2"></td>
    </tr>
    <tr>
        <td rowspan="2"></td>
        <td></td>
        <td></td>
    </tr>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

列表标签 无序列表使用 <ul> 标签去掉 li 前面的项目符号(小圆点) list-style: none;

<ul>
    <li>Coffee</li>
    <li>Milk</li>
</ul>

有序列表使用 <ol> 标签

<ol>
    <li>Coffee</li>
    <li>Milk</li>
</ol>

自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始

<dl>
    <dt>Coffee</dt>
    <dd>- black hot drink</dd>
    <dt>Milk</dt>
    <dd>- white cold drink</dd>
</dl>

表单标签 表单域使用 <form> 标签 <form action="url地址" method="提交方式" name="表单域名称"></form>

<input>输入表单元素 <input>标签的type属性

<input>标签的其他属性 name和value是每个表单元素都有的属性值，主要给后台人员使用 name表单元素的名字，要求单选按钮和复选框要有相同的name值 <label> 标签 用于绑定一个表单元素，当点击<label>标签内的文本时，会自动将焦点(光标)转到或者选择对应的表单元素上，用来增加用户体验 <label>标签的for属性应当与相关元素的id属性相同

<label for="nan">男</label>
<input type="radio" name="sex" id="nan">

<select>下拉表单元素 在<option>中定义 selected="selected"时，当前项即为默认选中项

<select>
    <option value="volvo">Volvo</option>
    <option value="saab">Saab</option>
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
</select>

<textarea>文本域元素 rows="显示的行数" cols="显示的列数"

<textarea rows="10" cols="30">
　　我是一个文本框。
</textarea>

标签：不定期,表格,标签,单元格,笔记,HTML,链接,属性
来源： https://www.cnblogs.com/sweet-potatos/p/15194482.html