HTML | 青训营

125 阅读1分钟

HTML 是什么

  • 使用标签表示超文本的内容

image.png

  • 浏览器会将HTML文件转化成DOM树
<!doctype html>
<html>
    <head>
        <meta charset="UTF-8"> 
        <title>标题</title>
    </head>
    <body>
    </body>
</html>

image.png

语法

  • 不区分大小写,建议小写以便于和自定义标签区分
  • 属性值建议双引号,属性值为true可以省略

标签

标题

<h1> ~ <h6>

列表

有序 <ol>列表项<li>

无序<ul>列表项<li>

定义<dl>列表项:<dt> (标题) <dd>(描述) 是多对多的关系

链接

<a href="" target="_blank">

多媒体

<image src="" alt="" width="">

<audio src="" controls> controls 浏览器默认的播放条

<video>

输入

image.png

选择

单选 多选 下拉 提示 image.png

image.png

文本

引用类: <blockquote> <cite>

代码: <code>

强调: <strong> 内容重要 <em> 语气强调

内容划分

image.png

语义化

  • 开发者:读代码
  • 浏览器:展示页面
  • 搜索引擎:提取关键词、排序
  • 屏幕阅读器