HTML总结（慢慢更新）

最新推荐文章于 2024-08-12 16:01:18 发布

@美少女壮士

最新推荐文章于 2024-08-12 16:01:18 发布

阅读量179

点赞数

分类专栏：前端文章标签： html

本文链接：https://blog.csdn.net/weixin_42129266/article/details/109442290

版权

前端专栏收录该内容

3 篇文章 0 订阅

订阅专栏

标签的作用

DOCTYPE/lang/字符集的作用

<! DOCTYPE>：文档类型声明，用来告诉浏览器使用哪种html版本来显示网页。
< lang>：用来定义当前文档显示的语言。
字符集：多个字符的集合，以便计算机能够识别和储存各种文字。UTF-8是万国码

<!DOCTYPE html>

这句代码的意思是：当前页面采取的是HTML%版本来显示网页。
注意：<!DOCTYPE>不是一个HTML标签，它是一个文档类型声明标签。html里面的才是HTML标签。

<meta charset="UTF-8">

HTML常用标签

标题标签/段落标签/换行标签/图像标签

标题标签：< h1 >~< h6 >
段落标签：< p >< /p >。根据浏览器大小自动换行，段落与段落之间保有空隙。
换行标签：< /br>。强制换行，单标签，无空隙。
图像标签：< img src="" alt=“图片显示不出来时候，替换文本” title=“鼠标放上图片都提示文本” width=“宽度” heigh=“高度” border=“边框”/ >

文本格式化标签

加粗：< strong >< /strong>
倾斜：< em> < /em >
删除线：< del >< /del >,< s >< /s >
下划线：< ins >< /ins>,< u >< /u >

div/span标签

都是盒子，用来显示内容
< div >:分割，独占一行。
< span >:跨距/跨度。

超链接标签

<a href="跳转目标" target="目标窗口的弹出方式，_self默认方式，_blank新窗口打开方式"></a>

注意：如果href里面是个文件或者压缩包，则为下载文件。文本、音频、视频、表格、图像都可以添加，都是网页元素链接。
锚点链接：点击链接快<速定位到网页的某一位置

<a href="#two"></a>
 <h4 id="two"></h4>

注释标签和特殊字符

<!--注释内容-->  快捷键：ctrl+/

特殊字符：&nbsp；&lt；&gt等等

表格标签

表格标签：用于展示数据

<table>
     <tr>
         <td>单元格的内容</td>
         ......
     </tr>
</table>

表头单元格：< th ></ th >，会加粗居中显示，用于表格第一行重点显示。
< thead>< /thead>：定义表格头部，内部必须拥有< tr>< /tr>,一般位于第一行。
< tbody>< /tbody>：用于定义表格的主体，主要用于放数据本体。
合并单元格：

跨行合并单元格：rowspan=“合并个数”；
跨列合并单元格：colspan=“合并个数”；

列表标签

无序列表

<ul><li></li></ul>

注意：
1、ul中只能放li标签
2、无序列表的列表项并列，没有顺序之分
3、< li >< /li >相当于一个容器，可以嵌套其他标签
4、无序列表会带有自己的样式属性，但是使用时会使用css来设置

有序列表

<ol>
    <li></li>
    <li></li>
    <li></li>
 </ol>

注意事项和无序列表一样，但是有顺序之分。

自定义列表

使用场景：自定义列表长用于对术语或者名字进行解释和描述，定义列表的列表项前没有任何项目符号。

<dl>
    <dt>名词</dt>
    <dd>名词解释1</dd>
    <dd>名词解释2</dd>
</dl>

注意：dd、dt里面可以放任何标签。

表单标签

表单是为了收集用户信息。
在一个完整的HTML中，一个完整的表单由：表单域、表单控件（也称表单元素）和提示信息组成。

表单域

表单域是一个保护表单元素的区域。HTML中用< form>定义表单域。
< form >会把他范围内的表单信息提交给服务器。

<form action="url地址" method="提交方式" name="表单域名称">
     各种表单元素控件
</form>

表单控件

< input >表单元素

其中属性如下。
在这里插入图片描述

name属性可以实现多选按钮多选一。要求单选框和复选框要用相同的name值。
name、value是每个每个表单元素都有的属性值，主要给后台人员使用

< label >标签

< label >：为input标签定义标注；用于绑定一个表单元素，当点击< label >上的文本的时候，浏览器会自动将光标聚焦到相对应到表单元素上，以增强用户体验。
核心：< label >里面到for对应相对应到表单元素里面到id。

< select >标签

< select >：下拉列表。

<  select >
         <option selected="selected">选项一,selected为默认选择</option>
         <option>选项二</option>
         ....
</select>

< textarea >文本域标签

使用场景：文字内容过多，多行文本输入框。
cols=“每行多少个字”，rows=“多少行”，实际开发用css来改变，实际开发不用。

@美少女壮士

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
HTML总结（慢慢更新）

HTML篇标签的作用DOCTYPE/lang/字符集的作用HTML常用标签标题标签/段落标签/换行标签/图像标签文本格式化标签div/span标签标签的作用DOCTYPE/lang/字符集的作用<! DOCTYPE>：文档类型声明，用来告诉浏览器使用哪种html版本来显示网页。< lang>：用来定义当前文档显示的语言。字符集：多个字符的集合，以便计算机能够识别和储存各种文字。UTF-8是万国码<!DOCTYPE html>这句代码的意思是：当前页面采取的
复制链接

扫一扫