html结构

头部 head 
内容 body
标签和属性
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<p id='' class=''>内容</p>
</body>
</html>

标签：分为自定义和预定义

标签作用描述内容类型
<p>内容</p>

属性：描述内容特征

预定义：如 id class
自定义：如 data-admin="admin"
自定义标签需要加上前缀 data-
<p class="css">内容</p>

元素

元素等于标签加属性

文档

文本中任何内容都需要标签引入，css,`js,php
DOM模型

 <imput type="text" size="10" value ="" required></imput>

required :布尔值写required表示必须键入值，不写相反

页面加载顺序

自上而下
从左往右

HTML页面三宝

页面元素
css
javaScript

行内元素和块元素

行内元素不会独占一行，水平排列自动换行如 a span input
块元素独占一行，垂直排列如 p div

语法糖

{内容}
[属性]
例如：[id=admin]{内容}
默认生成的是div
class可以写成 .class{nav}
id可以写成 #id{nav}
重复生成 *n 表示
```
例如：
#id{nav}*6
```
父子管理用 >表示
```
例如：
ul>li{text}*10
```
兄弟关系 + 表示
```
例如：
h1{cv}+p{vb}
```
父级 ^ 表示
```
例如
.bix>span{cv}^p{12}
```
分组 () 表示
```
nav>h3{导航}+(ul>li*3>a{cv})
```

序号 $ $@

ul>li{cv-$}*3
顺序生成 1-3

ul>li{cv-$@6}*3
顺序生成 6-8

ul>li{cv-$@-1}*3
倒序生成 1-3

1014作业

html结构

标签：分为自定义和预定义

属性：描述内容特征

元素

文档

页面加载顺序

HTML页面三宝

行内元素和块元素

语法糖

相关文章