2. html主要代码片段

最新推荐文章于 2023-12-31 22:10:46 发布

夏赞恩

最新推荐文章于 2023-12-31 22:10:46 发布

阅读量301

点赞数

分类专栏：前端学习文章标签： html html5 css

原文链接：https://www.bilibili.com/video/BV1yx411d7Rc?from=search&seid=4423540985482929435

版权

前端学习专栏收录该内容

49 篇文章 1 订阅

订阅专栏

本文详细介绍了HTML中的元素、属性、注释及其标准文档结构。讲解了如何使用Emmet快速生成代码，元素的嵌套规则，以及文档头和文档体的重要组成部分。还特别强调了lang属性在定义页面语言中的作用，以及meta标签对于网页编码和适配手机端的重要性。

摘要由CSDN通过智能技术生成

工具

Emmet插件：自动生成html代码片段
比如！+ tab直接生成代码主要框架

注释

<!--注释内容-->

元素

<a href = "http://www.Iloveqingqing.com" title ="qingqing" >加油呀！</a>

元素 = 起始标记 + 结束标记 + 元素内容 + 元素属性(描述额外信息)
属性 = 属性名（herf） + 属性值（“http://www.qingqing.com”）
属性的分类：
- 局部属性: 某些元素特有的属性
- 全局属性：所有元素通用
- 空元素：有些元素没有结束标记，如下：
```
<meta charset="UTF-8">
```

元素的嵌套

元素不能互相嵌套
父元素、子元素、祖先元素、后代元素、兄弟元素（必须是拥有同一个父元素的两个元素）

标准的文档结构

html：页面、文档

<!DOCTYPE html> <!--以下代码是一个文档声明，告诉浏览器，当前所使用的的html标准是html5.如果不写声明，浏览器会进入怪异的渲染模式-->

根元素
一个页面最多只有一个根元素，并且该元素是所有其他元素的父元素或者是祖先元素。
lang属性：language，全局属性，表示该元素内部使用的文字是使用哪一种自然语言而成的。
```


<html lang="en">	
</html>
<html lang='cmn-hans'>
</html>
```

文档头

<!--文档头里面的内容不会显示到页面上
meta：元数据，指定网页的附加信息-->
<head>
<meta charset="UTF-8"> <!--charset指定网页的内容编码-->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!--如若使用IE浏览器，推荐使用edge内核-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"><!--适配手机端-->
</head>