DAY02

1.常用的ＨＴＭＬ标签

1.1

标签

诗意生活
...

用于分段。

1.2

...

标签

hello world
（最大）
hello world
...
hello world
（最小）
...

用于标题字。

1.3贴图

粘贴图片。

1.4

标签

负责网页的结构

设定定义列表的项目解说。

1.5

标签

html

设定定义列表的标签。

1.6

标签

...

设定定义列表的标签。

1.7

标签

...

无序号的列表（可指定符号）。

1.8

标签

...

列表的项目（可指定符号）。

2.css基本样式

        color:white;//(颜色)
        background-color: pink;//(背景)
        height: 50px;//(宽)
        line-height: 50px;//(行宽)
        text-align: center;//(文字水平居中)
        font-size: 20px;//(文字大小)

3.常用的选择器

1.1.类别选择器

类选择器根据类名来选择前面以“.”来标志，如：

.container{
           color:#FFF;
}

1.2.标签选择器

决定哪些标签采用相应的css样式，比如，在style.css文件中队p标签样式的声明如下；

p{
           font-size:12px;
           background:#900;
           color:#090;           
}

复制代码页面中的所有P标签的样式都是这样。

1.3.id选择器

id选择器可以为标有特定ＩＤ的HTML元素指定特定的样式。
前面以“#”号来标志，在样式里面可以这样定义：

#demoDiv{
color:#FFF;
}

这里表示id为demoDiv的元素的设置它的字体颜色为#FFF。

1.4.伪类选择器

有时候还会需要用文档以外的其他条件来应用元素的样式，比如鼠标悬停等。

a:link{
color:#FFF;
}
a:visited{
color:#FFF;
}
a:hover{
color:#FFF;
}

link表示连接在没有被点击时的样式。visited表示链接已经被访问时的样式。hover表示当鼠标悬停在链接上面的样式。

4.盒子模型

 div{
            width: 100px;
            height: 100px;
            background: red;
            margin-left: 100px;
            margin-top: 100px;

            border-width: 10px;
            border-style: ridge;
            border-color: blue;

            padding-left: 20px;
            padding-right: 20px;
            padding-top: 30px;
            padding-bottom: 30px;
        }

无标题.png

5.元素水平居中

P{
text-align:center;
}

6.样式重置

*{
margin:0;padding:0;
}

将所有元素重置。