day01

A今天学了什么

1.html和CSS是什么

html是标签组成的网页，加上css修饰的网页

2.了解了html标签的结构

开始标签是
结束标签是

3.html的常用标签有：

p是段落标签

h1~h6是标题，h1是一级标题（字体最大），h2是二级标题…
h0，h7，h8是无意义标签

ul是无序列表
li是列表项目
ul包含li

dl是定义列表
dt定义术语
dd定义描述
dl里面可以包含dt和dd

img是图片标签

input是输入框

a是超链接

button是按钮标签

div是盒子标签，可以盒子套盒子，可以包含很多标签在div里面

4.css的常用样式有：

color是颜色

width是宽度
height是高度

background-color是背景颜色
background-image是背景图片

text-align文字样式

border是边框
border-width是边框宽度
border-style是边框风格样式
border-color是边框颜色

margin是边界
margin-left是左边界
margin-right是右边界
如果margin只有一个数值(如margin：5px)，那么它指的是上下左右边界各数值则相等（都是5px）
如果margin有两个数值（如margin:5px 10px），那么它指的是上下边界数值是5px，左右边界则是10px
如果margin有三个数值（如margin:5px 10px 15px）,那么它指的是上边界是5px，左右边界是10px，下边界则是15px
如果margin有四个数值（如margin:5px 10px 15px 20px）,那么它则是一个顺时钟的方向，上边界是5px,右边界是10px,下边界是15px，左边界是20px

padding是填充元素（同上）

p:hover{color:blue}
//当鼠标移动到元素上时可以改变css的样式

5.css的常用选择器

p{   }是元素标签选择器
.one{   }class选择器
#two{  }id选择器
：hover{  }是伪类选择器

B我掌握好的地方

1.了解了html标签的结构

开始标签是
结束标签是

2.html的常用标签有：

p是段落标签

h1~h6是标题，h1是一级标题（字体最大），h2是二级标题…
h0，h7，h8是无意义标签

ul是无序列表
li是列表项目
ul包含li

dl是定义列表
dt定义术语
dd定义描述
dl里面可以包含dt和dd

img是图片标签

input是输入框

a是超链接

button是按钮标签

div是盒子标签，可以盒子套盒子，可以包含很多标签在div里面

3.css的常用样式有：

color是颜色

width是宽度
height是高度

background-color是背景颜色
background-image是背景图片

text-align文字样式

border是边框
border-width是边框宽度
border-style是边框风格样式
border-color是边框颜色

margin是边界
margin-left是左边界
margin-right是右边界
如果margin只有一个数值(如margin：5px)，那么它指的是上下左右边界各数值则相等（都是5px）
如果margin有两个数值（如margin:5px 10px），那么它指的是上下边界数值是5px，左右边界则是10px
如果margin有三个数值（如margin:5px 10px 15px）,那么它指的是上边界是5px，左右边界是10px，下边界则是15px
如果margin有四个数值（如margin:5px 10px 15px 20px）,那么它则是一个顺时钟的方向，上边界是5px,右边界是10px,下边界是15px，左边界是20px

padding是填充元素（同上）

p:hover{color:blue}
//当鼠标移动到元素上时可以改变css的样式

5.css的常用选择器

p{   }是元素标签选择器
.one{   }class选择器
#two{  }id选择器
：hover{  }是伪类选择器

C我掌握不好的地方

各元素单独拿出来用还可以弄清楚，很多组合在一起的时候容易弄晕

margin和padding容易弄混淆