CSS入门
<style>
p {
color: maroon;
}
</style>
<!--改变段落字体颜色为茶红色-->
h2 {
font-family: sans-serif;
color: gray;
border-bottom: 1px solid black;
}
<!--改变字体，实下划线-->
border-bottom和text-decoration:underline的区别，前者延伸到页面边缘，后者只在文本下有线。
创建CSS文件
<head>
<meta charset="utf-8">
<title>HTML and CSS exercise</title>
<link rel="stylesheet" href="exercise.css" >
</head>
来谈谈继承
元素可以从父元素继承样式
继承可以覆盖
类选择器
<p class="greentea">
p.greentea {
}
一个元素可以加入多个类，中间用空格分隔
<p class="greentea raspberry blueberry ">
如果三个类都定义了color属性，按照最后一个为准
增加字体和颜色样式
常用的文本属性
font-family 定制字体
font-size 控制字体大小
color设置颜色
font-weight设置字体粗细 lighter， normal，bold，bolder
text-decoration none,underline,overline,line-through
字体系列描述
sans-serif:无衬线字体
serif:衬线字体，新闻报纸文字排版
monospace:等宽字体
cursive:手写体，草书
fantasy:装饰性字体
字体包含多个单词打上双引号
font-famliy是一组候选字体
五大系列不是具体的字体名
引入web字体
@font-face {
font-family: "HaoJun SUN";/*自己定义名字*/
src: url("http://wickedlysmart.com/hfhtmlcss/chapter8/journal.woff"),
url("http://wickedlysmart.com/hfhtmlcss/chapter8/journal.tff");
调整字体大小
body {
font-size:14px;
}
h1 {
font-size:150%;
font-size:1.2em;
}
百分比是相当于父元素 用em指定字体大小，指定一个比例分子 还可以使用xx-small，x-small，small，medium，large，x-large，xx-large.
如何指定字体大小
选择一个关键字，推荐small和medium，作为body中的字体打小。
通常body默认16px
改变字体粗细
font-weight:bold;同样，从父元素继承了粗体，font-weight:normal;bolder，lighter
为字体增加风格
font-style:italic 斜体
font-style:oblique 倾斜
<em>标签只是强调，不一定就是斜体
web颜色如何工作
web颜色是按照构成颜色的红绿蓝三个分量所占数量来指定的。全部百分百是白色。
如何指定web颜色
1.按名称指定颜色
2.使用rgb值background-color:rgb(80%,40%,0%);还可以指定0-255的数值background-color:rgb(204,102,0)
3.使用十六进制编码。每组两位数字代表颜色的红绿蓝分量。
#cb0是#ccbb00的缩写
text-decoration
em {
text-decoration: underline overline;
}
在一个decoration声明上下线才能出现，不能累加
