终于开始CSS了，终于可以不无聊了

css（层叠样式表）
选择器{属性:属性值;属性:属性值;} 标点都是英文状态下

css字体样式属性
font-size：字号大小
相对长度单位说明
em 相对于当前对象内文本的字体尺寸
px 像素，最常用，推荐使用
绝对长度单位说明
in 英寸
cm 厘米
mm 毫米
pt 点

font-family：字体样式
用于设置字体 p{ font-family:"微软雅黑"}
可同时制定多个字体，中间用逗号隔开（表示浏览器如果不支持第一个字体，则尝试下一个字体，直到找到合适的）
使用技巧：
1、现在网页中普遍使用14px+
2、尽量使用偶数的数字字号
3、字体间必须使用英文状态下的逗号隔开
4、中文字体需要加引号，英文一般不需要。当设置英文字体时，英文字体必须位于中文字体名之前
5、字体名包含空格、#、$等符号，则该字体必须加英文状态下的单引号或双引号
6、尽量使用系统默认字体

CSS Unicode字体
在css中设置字体名称，可以直接写中文
方案一：可以使用英文来代替如font-family:"Microsoft Yahei"
方案二：可以在css中直接使用Unicode编码来写字体名称
如 font-family:"\5FAE\8F6F\96C5\9ED1" 表示设置字体为“微软雅黑”
可以通过escape()来测试属于什么字体

font-weight：字体粗细
字体加粗可用b和strong标签，css设置字体粗细无语义
可用属性值：normal bold bolder lighter 100-900（100的整数倍）
数字400等于normal 700等于bold

font-style：字体风格
字体倾斜可以用i和em标签，css设置字体风格无语义
normal：默认值，浏览器会显示标准的字体样式
italic：斜体的字体样式
oblique：倾斜的字体样式

font：综合设置字体样式
格式：选择器{font:font-style font-weight font-size/line-height font-family}
使用font属性时，必须按上面的语法格式书写顺序，用空格隔开各属性，不需要的属性可省略，必须保留font-size和font-family，否则不起作用

CSS注释
/*需要注释的内容*/

开发者工具（chrome）
f12或shift+ctrl+i
ctrl+滚轮放大或缩小开发者工具代码
左边是HTML元素结构，右边是CSS样式
css样式可以改动数值和颜色查看更改后的效果

标签选择器（元素选择器）
标签名/元素名{属性1：属性值1；属性2：属性值2；属性3：属性值3；}
例：p {color:gray;}

类选择器
使用“.”（英文点号）进行标识后面跟类名。
.类名{属性1：属性值1；属性2：属性值2；属性3：属性值3;}
标签调用的时候用class=“类名”
类选择器最大的优势是可以为元素对象单独或相同的样式定义
小技巧：1、长名称或词组可以试用中横线来未选择器命名
2、不建议使用“_”下划线来命名css选择器
3、不要纯粹数字、中文等命名，尽量使用英文字母表示

多类名选择器
给标签定义多个类名，从而达到更多的选择目的
注意：样式显示效果与html元素中的类名先后顺序没有关系，受css样式书写的上下顺序有关；各类名中间用空格隔开
例：<p class="important warning">
This paragraph is a very important warning.
</p>

id选择器
使用“#”进行标识，后跟id名
#id名{属性1：属性值1；属性2：属性值2；属性3：属性值3；}
元素的id值是唯一的，只能对应文档中某一个具体的元素，用法与类选择器基本相同

通配符选择器
用“*”表示，所有选择器中作用范围最广的，能匹配页面中所有的元素
语法：*{属性1：属性值1；属性2：属性值2；属性3：属性值3；}
例：*{
margin:0 /*定义外边距*/
padding:0 / *定义内边距*/
}

伪类选择器
用于向某些选择器添加特殊效果
链接伪类选择器
:link 未访问的链接
:visited 已访问的链接
:hover 鼠标移动到链接上
:active 选定的链接
书写时顺序按照 lvha

终于开始CSS了，终于可以不无聊了相关推荐

【Python】P4994 终于结束的起点
题目背景终于结束的起点终于写下句点终于我们告别终于我们又回到原点 -- 一个个 OIer 的竞赛生涯总是从一场 NOIp 开始,大多也在一场 NOIp 中结束,好似一次次轮回在不断上演. 如果 ...
[洛谷月赛]终于结束的起点
题目背景终于结束的起点终于写下句点终于我们告别终于我们又回到原点 -- 一个个 Oler 的竞赛生涯总是从一场 NOIp 开始,大多也在一场 NOIp 中结束,好似一次次轮回在不断上演. 如果 ...
五月天的《终于结束的起点》
作者:将离链接:https://www.zhihu.com/question/55080303/answer/144303735 来源:知乎这首歌是去年五月天的第九张专辑的第十一首歌,它前奏是五月 ...
luogu P4994 终于结束的起点
题目背景终于结束的起点终于写下句点终于我们告别终于我们又回到原点 -- 一个个 OIer 的竞赛生涯总是从一场 NOIp 开始,大多也在一场 NOIp 中结束,好似一次次轮回在不断上演. 如果 ...
终于结束的起点（滚动数组，记忆化搜索）
任意门终于结束的起点题目背景终于结束的起点终于写下句点终于我们告别终于我们又回到原点 -- 一个个 OIer 的竞赛生涯总是从一场 NOIp 开始,大多也在一场 NOIp 中结束,好似一次 ...
【洛谷 4994】终于结束的起点
[题目] 传送门题目背景: 终于结束的起点终于写下句点终于我们告别终于我们又回到原点 - - -- -- 一个个 OIer 的竞赛生涯总是从一场 NOIp 开始,大多也在一场 NOIp 中结束 ...
MVC中用 BundleCollection 压缩CSS时图片路径问题
MVC中有个专门提供JS和CSS压缩的类,BundleCollection,其实这个类也可以在asp.net中用, 关于BundleCollection类的详细推荐个地址:http://www.cnb ...
CSS + DIV 让页脚始终保持在页面底部
来源:David's Blog http://www.DavidQiu.com/ 文章链接:http://blog.davidqiu.com/post/2013-06-17/400517539 ...
css 闪光_闪光VS。 CSS / HTML：您会选择哪个？
css 闪光 Macromedia Flash. It's one of the most controversial products in the Web development world. M ...

终于开始CSS了，终于可以不无聊了

终于开始CSS了，终于可以不无聊了相关推荐

最新文章

热门文章