前端学习笔记（四）——css

——css基础

16px = 1em 是文本的默认大小；

链接外部样式表<link rel="stylesheet" type="text/css" href="mystyle.css">

id选择器： #id名字 {属性：值 ； 属性：值}

例：#demo {color : red ; font-size : 10px; }   

<p id="demo">这个段落将会被应用格式</p>；

派生选择器：# id名字  元素{属性：值；属性：值；}  

例：#demo h1{ color:red ; font-size : 10px;}  

<h1 id="demo" >样式会应用到这里</ h1>

<d id="demo">样式不会应用到这里</p>；

类选择器： . 类名{属性：值；属性：值；}

    例：  . center {text-align : "center" ; }

<h1 class="center">样式会应用到这里</h1>

<h1 class="left">样式不会被应用到这里</h1>

属性选择器：

[title] {color:red}所有title属性都会应用到 这个样式。例如：<h1 title="demo">；

[title = hello] { color : red;}只有title属性值等于hello，才回被应用样式；例如：<h1 title="hello">；

[title ~= hello]{color : red ;}只要titlr属性值中包含hello，样式即可被应用；例如<h1 title="hi hello world">；

[title |=hello]{ color : red ;}以hello开头的元素，样式即可被应用；例如< h1 title=" hello demo"> ；

独立创建一个规则即可摆脱父元素的规则；

改变超链接样式的时候要注意：hover 必须在link和visited后面，active必须在hover后面；

在css中，width和height指的是内容区域的宽度和高度，改变margin和padding的值并不会影响到内容区域的尺寸，但是会增加元素框的总尺寸；

边框属性按照顺时针赋值（上、右、下、左），当缺少左外边距的值，用右边的值代替；缺少下边和右边的外边距的值则用上边距的值代替；