动脑笔记
什么是 HTML？
- HTML 是用来描述网页的一种语言。
- HTML 指的是超文本标记语言 (Hyper Text Markup Language)
- HTML 不是一种编程语言，而是一种标记语言 (markup language)
- 标记语言是一套标记标签 (markup tag)
- HTML 使用标记标签来描述网页
标签分类---块级元素和行内元素
块级元素：
div
h(x) - 标题
p - 段落
table 表格
ul - 非排序列表
行内元素
span - 常用内联容器（嵌套在其他容器中，把它包含的内容文本定义颜色、字体等属性），定义文本内区块
a - 锚点
i - 斜体
img - 图片
input - 输入框
不同点
- 块级元素一个标签独占一行，其宽度自动填满父级元素宽度（不是高度），行内元素不会独占一行，相邻的行内元素会排列在同一行，知道排不下才另一行，其宽度随内容的变化而变化
- 块级元素可以设置with、height属性，而行内元素即使设置了这些属性是无效的。（除非设置了样式的display属性为block属性，行内元素和块元素是可以通过display属性修改来转换的，只是默认的属性值不同而已）
- 行内元素设置的margin、padding属性只有水平方向才会产生边距，垂直方向设置的边距没效果。
笔记
给标签设置属性（样式）：不同的样式用“；”隔开，属性名字和值之间用“：”
<div style="border: 1px solid red;background-color: aquamarine">adff</div>
也可以在head标签里面设置
<style type="text/css"> <!--type属性说明样式的格式为css-->
//“*”为通配符，表示所有标签都有这个属性（标签选择器）
*{
/*border: 1px solid red border的样式格式，记住*/
border: 1px solid red;
margin-left: 0px;
margin-right: 0px;
}
</style>
另外在head标签里面还是设置一些全局属性
<!--设置javaScript 的文件路径和数据类型-->
<script type="text/javascript" src="03.js"></script>
<!--设置当前页面的数据类型-->
<meta http-equiv="content-type" content="text/css" charset="UTF-8">
<!--标题，浏览器最上面标签的标题-->
<title>Title</title>
标签选择器
*{
/*border: 1px solid red border的样式格式，记住*/
margin-left: 0px;
margin-right: 0px;
}
/*标签选择器： 表示页面所有的div标签的样式*/
div {
color: blueviolet;
width: 200px;
height: 300px;
background-color: blueviolet;
}
/*标签选择器： id选择器表示id为mydiv的标签的样式*/
#mydiv{
color: red;
width: 200px;
height: 200px;
display: block;
display: inline;
display: inline-block;
background-color: aquamarine;
border: 2px solid red;
border-right: 4px solid red;
}
/*标签选择器： class选择器，和id不是的是class可以有多个相同的，而id只允许有一个*/
.cls_div{
color: red;
width: 200px;
height: 200px;
background-color: chartreuse;
border: 2px solid red;
border-right: 4px solid red;
/*表示上下左右边距*/
padding: 10px;
/*表示上下、左右*/
padding: 10px 40px;
/*表示上 左右 下*/
padding:10px 10px 10px 10px;
}
<div>这是一个div</div>
<div id="mydiv">这是一个div1</div>
<div class="cls_div">这是一个div2</div>
display
display属性为修改标签的类型，inline-block为既可以修改宽高，也可以在同一行。
css盒子模型
盒子模型是指，标签都是一些“盒子”，有margin、padding，等边距属性还有border边框，组成盒子的大小。
