HTML基础梳理

---

---

DOCTYPE:文档声明部分

html：网页的根标签，放在最外层，一个网页只会出现一次。
lang:语言选择 语言类型 en’英语 zh‘中文

head：
网页头部 记录网站的一些相关信息

编码 网页当中打中文 title 标题

body：
网页主题内容。主要代码的编辑区域，用于展现内容

html语法

*所有标签都应包含在<>
*大部分标签都有开始和结束标签
*标签可以拥有属性，属性总是以 style=“属性名=‘属性值’” 两个属性之间空格隔开
*标签可以进行嵌套；
*标签名大小写都可以，但是建议小写
*html后缀名为 .html 或者 .htm
*注释 用于文档说明。快捷键ctrl+/
*写完一个标签换行

常见的标签

h1~h6 标题标签
p段落标签
div 块级标签，一般用于布局
span 无意义文本标签 一般用于突出显示文字 或者强调文字的时候使用
b 文字文本加粗
strong 加粗文字
i 文字斜体，不建议使用，一般在css上做
em 文字的斜体，加重语气
small 比一般的文字小一点
下标sub
上标sup
del 有删除线的文本

最常用：a 超文本标签

href默认进行链接跳转 设置跳转地址的时候必须加上http或https
*超链接跳转

  执行JS代码
  <a href="JavaScript:alert(123)">执行JS代码</a>

  打电话
  <a href="tel:15181242694">打电话</a>

  发短信
  <a href="sms:5151515151" >发短信</a>

  发邮件
  <a href="mailto:1138446174@qq.com?suject=邮件主题&body=邮件内容">发邮件</a>

download 下载

title鼠标停留在标签时候显示的文字

target 打开网页的链接在什么位置显示。
_blank 新标签打开
_self 当前页
_top 顶层
_parent 窗口打开

图片

或者
src:图片地址

绝对地址

http：//等
c：//

相对地址

兄弟 图片.后缀
父子 文件/图片.后缀
…/代表返回上一级

alt 图片未加载时候 alt显示相应的文字信息

媒体

》》音频
aaudio: 支持的格式mp3，wav，ogg
controls：控制工具属性
loop：循环
muted：静音
autoplay：自动播放 已经被禁用
video 支持格式
controls：控制工具属性
loop：循环
muted：静音
autoplay：自动播放 已经被禁用
width：宽
height：高

其他

code
单行代码包裹标签。

pre
预格式化文本，换行和空格会保留格式

br
换行符

hr
分割线，横线

实体符号（注意切勿复制 文中；为中文状态）
&nbsp；格教
&lt；<
&gt； >

列表
有序列表 有序号
ol
li

<ol>
    <li>js</li>
    <li>java</li>
    <li>web</li>
</ol>

无序列表 小圆点
ul
li.

<ul>
    <li>js</li>
    <li>java</li>
    <li>web</li>
</ul>

type标签属性：
ol：1，A, a, I, i
ul：disc circle square

dl、 dt、dd 已不常用

标签的分类

内联标签

*不会单独占一行
*排列方向从左向右依次排列，直到排列不下的时候会换行
*宽度由内容决定
*包含：span、a、img、strong、i、em、b

块标签

*会独占一行
*排列方式是从上往下
*当前标签的宽度是父标签宽度的100%
*包含：h1~h6、div、p、ul、ol、li

标签嵌套规则

*原则上块级标签可以嵌套块级标签和内联标签；
*内联标签原则上只能嵌套内联标签；
*p和h1~h6 只能嵌套内联标签；
*ul和ol只能嵌套li，li可以嵌套任意标签；