CSS（Cascading Style Sheets,层叠样式表）
引入方式
- 通过<link>标签引入（外部样式）
为了成功加载一个外部样式表（外部样式表只能包含css注释和css规则，不能有其他文档标记，否则会造成一部分或者全部被忽略），link标签需要放置在head标签内部。
候选样式表，即将rel属性的值设置为alternate stylesheet,大多数基于Gecko的浏览器都可以支持候选样式表，不过通过js,IE也可支持。 - 通过在<style>标签中（内部样式）写入样式，一定要设定type属性
图片.png
- 通过在<style>标签中的@import
@import一定要写在style标签内，并且要在所有CSS规则之前
图片.png
- 通过在标签中加入style属性(内联)
图片.png
相对路径和绝对路径
-
相对路径
相对于目前路径名的文件写法，只要开头不是（/）就不是绝对路径 -
绝对路径
由根目录（/）开始写起的文件名或目录名称 -
. 表示当前目录； .. 表示上一层目录
以下这几种文件路径分别用在什么地方，代表什么意思?css/a.css （网站路径，css路径下的a.css文件）
./css/a.css （相对路径，当前路径下css下的a.css文件）
b.css （相对路径，当前路径下的b.css文件）
../imgs/a.png （相对路径，当前路径的上一级下的a.png图片）
/Users/hunger/project/css/a.css （绝对路径，根目录下的User文件夹下的hunger文件夹下的project文件夹下的css文件夹下的 a.css文件）
/static/css/a.css （网站路径，代表网站服务器根目录static文件夹中的css文件夹中的a.css文件）
http://cdn.jirengu.com/kejian1/8-1.png （8-1.png的网站路径）
**ps:如果我想在js.jirengu.com上展示一个图片，需要怎么操作? **
方法1：可以直接将图片上传到服务器，在页面使用这张图片；
方法2：如果这个图片本来就存在网络上其他的服务器上，可以直接使用图片的网络绝对路径链接的方式在页面上添加url引用这张图片
html和css的一些书写规范
- 语法不分大小写，推荐统一使用小写
- 内容与样式分离
- id和class使用有意义的单词，分隔符建议使用-
- 有可能尽量用缩写
5.属性值是0的省略单位 - 块内容缩进
- 属性名冒号后添加一个空格
chrome 开发者工具
- 使用Elements面板检查和实时编辑页面的HTML和CSS
- 在 Elements 面板中检查和实时编辑 DOM 树中的任何元素。
- 在 Styles 窗格中查看和更改应用到任何选定元素的 CSS 规则。
- 在 Computed 窗格中查看和修改选定元素的框模型。
- 在 Sources 面板中查看在本地对页面所做的更改。
- 使用 Computed 窗格检查和编辑当前元素的框模型参数。 框模型中的所有值均可修改，只需点击它们即可。
[参考]
图片.png
网友评论