对于新人来说想要了解css，就要从最基本的入手了解，讲真的学习css入门很简单，学习html 和css短时间后你就可以制作一个网页，深入的去学习的话，就会很难。他就是从简——深——深——简的一个过程，如果你真正熟悉掌握之后，就可以轻松对付日常工作。
不管是传统的Web开发或者是现代的Web 应用开发，至少到今天为止还是离不开CSS。这篇文章带你们认识一下css.
什么是CSS ？
CSS（Cascading Style Sheets）层叠样式表，又叫级联样式表，简称就是样式表，
1、 用于html文档中元素样式的定义，实现了将内容与变现分离，提高了代码的可重用性和可维护性
例如：
效果图片：
html:页面结构
css:页面美容
2、 文件后缀是.css
3、 样式通常存储在样式表中
4、 外部样式表可以极大提高工作效率
5、 外部样式通常存储在CSS文件中
6、 多个样式定义可层叠为一
CSS与HTML 之间的关系是什么？
1、 HTML用于构建网页的结构
2、 CSS用于构建HTML元素的样式
3、 HTML是页面的内容组成，CSS是页面的变现
结构层：HTML 表示层：CSS 行为层：JavaScript
怎样使用CSS样式表的方式？
1、内联方式
使用style属性，只是对当前标签有效，页面内容和样式高度耦合(直接把CSS代码用style属性添加到开始标签中)
<p style=”color:red”>红色字体</p>
2、内部样式表
在head中使用style标签，当前页面有效，内容和样式一定程度分离，但是不彻底(直接把CSS代码添加到头部的style标签中)
<head>
<style>
P{color:red;}
</style>
</head>
3、 外部样式表
将样式写到一个单独CSS文件中，需要用到HTML文件，引用它即可。
<link rel=”stylesheet” href=””/> StyleSheet,的意思就是样式调用
4、 导入式
<head>
<style>
@import url(my.css);
</style>
</head>
优先级：行内样式>内部样式>外部样式>导入样式
css加载方式link和@import的区别，为什么不推荐使用@import？
1、@import是CSS提供加样式的一种方式，只能用于加载CSS。Link标签除了可以加载CSS外，还可以做很多其他的事情，比如定义rel连接属性等。
2、加载顺序的差别。当一个页面被加载的时候，link引用的CSS会同时被加载，@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览器@import加载CSS的页面时开始会没有样式（就是闪烁），网速慢的时候会比较明显。
3、兼容性的差别。@import在IE5以上才能识别，而link标签无此问题。
4、使用dom控制样式时的差别。当时用JavaScript控制dom去改变样式的时候，只能使用link标签，因为dom操作元素的样式时，用@import方式的样式也许还未加载完成。
5、使用@import方式会增加html请求，会影响加载速度，所以谨慎使用该方法。
CSS语法
CSS规则由两个主要的部分构成：选择器以及一条或多条声明。
1、 css是以属性/值对形式出现
2、 属性（property）是您希望设置的样式属性（style atribute）。每个属性都有一个值，属性和属性值之间用冒号（：）连接
如：selector{property：value}
3、 多对属性之间用分号（；）隔开
如：h1{color:red;font-size:14px;}
注释格式：<!—html注释语句-->
/*css注释语句 */
Html/css注释快捷键：Ctrl+/ 单行注释/取消注释
Ctrl+shift+/ 多行注释/取消注释
基本属性：
字体属性
font-style：字体（斜体）
font-variant ：字体的变化（大小写）
font-weight ：字体粗细
font-size：字体大小
font –family：字体名称
文本相关属性：主要包含颜色color、对齐方式text-algin、修饰效果text-decorationt
尺寸属性：
height：设置元素的高度
line-height：设置行高
max-height：设置元素的最大高度
max-width：设置元素的最大宽度
min-height：设置元素的最小高度
min-width：设置元素的最小宽度
width：设置元素的宽度
背景相关：
CSS说简单也很简单，无非就是记和练。记得全了，练习的多了，自然而然就会用了。说难也难，因为它涉及面比较广。所以说先从简单的学起，边学边记边练，只要把最常用的牢记并且熟练应用，基本的任务也就可以轻松应对。
（ps:如果您觉得有用，请点赞转发，让更多人看到哦）
1334
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
