HTML CSS
html:负责网页构造的(VSCode 抉择 html5)
css:负责网页款式的
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
html:由标签组成(网页的最根本组成单位是标签)
单标签:没有内容
双标签:开始标签和完结标签(两头能够放内容)** 写在元素开始标签之中的都是该标签的属性 **
<!DOCTYPE html>:用来申明文档类型
<html></html>:代表了整个网页
<head></head>:用来写网页的一些配置信息
<meta charset=”UTF-8″>:申明文档的编码格局
<title></title>:负责网页题目
<body></body>:负责网页内容
格局:标签换行,开始标签和技术标签要对齐(一条竖线)
子父级之间相差一个 tab 键
网页布局
1. 画块 div
2. 给元素 / 标签加款式
1)内联 / 行内款式:写在元素开始标签外面的形式
<div style="width: 500px;height: 500px;background: red;">
<div style="width: 200px;height: 200px;background: pink;"></div>
</div>
<div style="width: 300px;height: 300px;background: blue;"></div>
<div style="width: 100px;height: 100px;background: yellow;"></div>
2)外部款式:写在 head 里的 style 标签里,须要大括号包裹
class 属性:能够重名
class 命名标准:不能用中文、不能用特殊符号(_除外)、不能应用纯数字、不能应用数字结尾、不能用大写字母、不能有空格、命名正当(见名知意)
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
div{width: 100px;height: 100px;background: black;}
.box{width: 200px;height: 200px;background: red;}
.red{width: 200px;height: 200px;background: blue;}
</style>
</head>
<body>
<div class="box">
<div></div>
</div>
<div class="red"></div>
</body>
id:不能重名