经过一段时间的学习,已经把html大部分知识撸了一遍,对于开发也算是入了个门,下一阶段的目标是学习CSS,接下来就开始初步了解CSS。
CSS格式
<style type="text/css">
h1{
text-align: center;
color: green;
font-weight: bold;
}
p{
text-align: center;
color: red;
}
</style>
- 注意点:
- style标签必须写在head标签中
- type属性可不写
- 设置样式时必须按照固定的格式来设置,:和;不省略
CSS文字属性
- 规定文字样式
- 格式:
font-style: italic;
- 取值:
- normal:正常的,默认值
- italic:倾斜的
- 规定文字粗细
- 格式:
font-weight: bold;
- 单词取值
- bold:加粗
- bolder:比加粗还粗
- lighter:细线,默认值
- 数字取值
- 100-900之间整百数字
- 规定文字大小
- 格式:
font-size: 30px;
- 注意:一定要带单位,即px
- 规定文字字体
- 格式:
font-family: "微软雅黑";
- 注意点:若取值是中文,则用单引号或双引号括起来
- 字体属性补充
- 默认字体:宋体
- 若设置字体不存在,但又不想用默认字体来显示咋办?
- 可以设置备选方案
格式:
- 可以设置备选方案
font-family: "字体1","备选方案1",…;
- 缩写格式:
font:style weight size family;
- 注意点:
- style,weight可以省略,且相互交换位置
- size,family不能省略,且不能交换位置
文本属性
- 文本装饰属性
- 格式:
text-decoration: underline;
- 取值:
- underline:下划线
- line-through:删除线
- overline:上划线
- none:什么都没有,常用于去掉超链接的下划线,默认值
- 文本水平对齐
- 格式:
text-align: center;
- 取值:
- left,居左,默认值
- center,居中
- right,居右
- 文本缩进属性
- 格式:
text-indent: 2em;
- 取值:
2em,em表示缩进一个文字
颜色属性
- 如何修改文字颜色
- 格式:
color:值;
- 取值:
- 英文单词
- 常见颜色,有限制
- rgb
- 三原色
- 格式:rgb(0,0,0);
- rgba
- a表示透明度,取值为0-1,取值越小越透明
- 格式:rgba(0,0,0,1);
- 十六进制
- 本质就是RGB
- #FFEE00 FF表示R,EE表示G,00表示B
- 十六进制缩写
- 英文单词