CSS入门
CSS核心基础
一. CSS样式基础
CSS样式中的选择器严格区分大小写,属性和值不区分大小写,按照书写习惯一般将“选择器、属性和值”都采用小写的方式。多个属性之间必须用英文状态下的分号隔开如果属性的值由多个单词组成且中间包含空格,则必须为这个属性值加上英文状态下的引号在CSS中可以使用空格键、Tab键、Enter键等对样式代码进行排版,提高代码的可读性
二.选择器{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
三.引入CSS样式
1.内嵌式
内嵌式是将CSS代码集中写在HTML文档的< head >头部标记中,并且用< style >标记定义。一般位于< title>标记之后。
基本语法格式:
<head>
<style type="text/css">
选择器{属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}
</style>
</head>
2.链入式
链入式是将所有的样式放在一个或者多个以.css为扩展名的外部样式表文件中,通过< link />标记将外部样式表文件链接到HTML文档中基本
语法格式:
<head>
<link href="CSS文件的路径" type="text/css" rel="stylesheet" />
</head>12
导入式
导入式与链入式相同,都是针对外部样式表文件的。但是链入的时间点不一样。
基本语法格式:
<style type="text/css" >
@import url(css文件路径);或 @import "css文件路径";
/* 在此处还可以存放其他css样式*/
</style>
四.CSS基础选择器
标记选择器
基本语法格式:
标记名{属性1:属性值1;属性2:属性值2;属性3:属性值3;}
五.CSS文本外观属性
1.color:文本颜色
(1)预定义颜色的值,如:red、green、blue、等
(2)十六进制,如:#FF0000、#FF6600、等
(3)RGB代码,如:红色可表示为rgb(255,0,0)rgb(100%,0%,0%)l
2.etter-spacing:字间距允许使用负值,默认为normal world-spacing:单词间距单词间距 中文字体无效
3.line-height:行间距
4. text-transform:文本转换
(1)none不转换(默认值)
(2)capitalize 首字母大写
(3)uppercase 全部字符转换为大写
(4)lowercase 全部字符转换为小写
5. text-decoration:文本装饰
(1)none 没有装饰(正常文本默认值)
(2)underline 下划线
(3)overline 上划线
(4)line-through 删除线
6. text-align:文本对齐方式
(1)left 左对齐
(2)right 右对齐
(3)center 居中对齐
7. text-indent:首行缩进
8. white-space:空白符处理
(1)normal常规(默认值)文本中的空格、空行无效,满行(到达区域边界)后自动换行
(2)pre 预格式化,按文档的书写格式保留空格,空行原样显示(3)nowrap 空格空行无效,强制文本不能换行,除非遇到换行标记< br/>。内容超出元素的边界也不换行,若超出浏览器页面会自动增加滚动条
我的网页