web前端开发的点点滴滴---3.CSS介绍
2015-10-10 13:00
471 查看
CSS介绍
CSS即层叠样式表(Cascading Style Sheets),HTML中使用它进行页面排版、字体、颜色设置等。CSS分为3种类,分别为外联样式、内联样式、行内样式。
外联样式
外联样式是将样式写在另外后缀名为css的单独文件中的样式,通过CSS选择器对HTML页面中特定的元素集合赋予样式。
外联样式通过以下代码在HTML页面中引用:
<link rel="stylesheet" type="text/css" href="demo.css" />
或者另外一种不常用的方法(这种方法会先把页面加载好,所以样式还没加载好时页面的布局会被破坏):
<style type="text/css"> @import url(demo.css) </style>
demo.css文件内容:
body { /*CSS标签选择器,选择body标签*/ /*设置页面默认字体为18px*/ font-size:18px; /*设置页面默认字体颜色为灰色*/ color: #666; }
内联样式
内联样式是将样式写在HTML页面中的style标签里的样式,如下:
<style type="text/css">
body { /*CSS标签选择器,选择body标签*/ /*设置页面默认字体为18px*/ font-size:18px; /*设置页面默认字体颜色为灰色*/ color: #666; }
</style>
行内样式
行内样式是将样式写在普通的html标签的style属性里样式,如下:
<!-- 设置此div中的文字大小为18px,颜色为红色 --> <div style="font-size:18px;color:red;">测试测试</div>
相关文章推荐
- week6---10月13日 CSS样式
- 关于css的标准盒子模型
- Css 之 px em %
- css 权重及!important
- css控制页面书签
- CSS尺寸和字体单位-em、px还是%
- css积累
- 异步创建js,css,外部内嵌样式
- JS-可变参(arguments )取非行间样式
- css3设置box-pack和box-align让div里面的元素垂直居中
- 关于css的float,overflow及z-index属性
- 关于css的定位属性
- 关于css的背景和列表属性
- 关于css的字体和文本属性
- 关于css的单位
- 关于css中的样式表冲突
- css的扩展选择器
- css的基本选择器
- css与html的结合方式
- css3响应式布局