HTML5学习_day01(3)--css样式引用方式
2016-09-20 16:44
169 查看
一.内嵌格式
语法:在标签中写一个style的属性
优点:优先级最高
缺点:不已修改,维护困难,代码量非常大,存在代码冗余。
例子:
width:宽度 height:高度 background-color:背景颜色
效果如下:
二.内部样式
写法:在head标签写一个style标签,在style标签里面通过选择器来选择标签来控制该标签的样式。
优点:不需要加载服务器(不需要加载web服务器端的css文件),加载速度非常快。
缺点:不利于代码的扩展和重用,只能在单个页面里面使用。
CSS样式的详细使用方式 请点击下方链接
点击打开链接
三.
外部样式:
写法:
1.新建一个外部CSS文件
2.在css文件里通过选择器来控制样式。
3.在head标签里面通过link来关联外部css文件。
例如:<link
rel="stylesheet"
type="text/css" href="css/style.css"> 然后与第二引用方式一样使用就OK了
优点:重用性强,有利于扩展
缺点:需要从WEB服务器中加载css文件。
语法:在标签中写一个style的属性
例如:<pre><div style="属性1:属性值1;属性2:属性值2;"></pre>
优点:优先级最高
缺点:不已修改,维护困难,代码量非常大,存在代码冗余。
例子:
<div style="width:200px;height: 100px;background-color: greenyellow;"></div>
width:宽度 height:高度 background-color:背景颜色
效果如下:
二.内部样式
写法:在head标签写一个style标签,在style标签里面通过选择器来选择标签来控制该标签的样式。
优点:不需要加载服务器(不需要加载web服务器端的css文件),加载速度非常快。
缺点:不利于代码的扩展和重用,只能在单个页面里面使用。
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> 此处写css样式 </style> </head> <body> </body> </html>
CSS样式的详细使用方式 请点击下方链接
点击打开链接
三.
外部样式:
写法:
1.新建一个外部CSS文件
2.在css文件里通过选择器来控制样式。
3.在head标签里面通过link来关联外部css文件。
例如:<link
rel="stylesheet"
type="text/css" href="css/style.css"> 然后与第二引用方式一样使用就OK了
优点:重用性强,有利于扩展
缺点:需要从WEB服务器中加载css文件。
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" type="text/css" href="文件路径"/> </head> <body> </body> </html>
相关文章推荐
- CSS学习-- 样式引用方式(外部引用,内部引用)
- WPF开发学习:资源在内外部定义的不同方式和怎么引用,Style样式的四种使用(对比CSS)
- HTML5学习_day01(5)--css常见样式background
- 用类名做方法的返回值类型 在学习Java的初始阶段,很多同学使用基本数据类型定义变量和引用类型定义变量以及使用类名做方法的返回值类型常常不知所以。今天我以自己的解读方式和个人的理解作一个简单的解释,和
- html5与css3学习笔记-day01
- 正则学习:组的定义及引用方式
- HTML5学习_day01(2)--HBuilder工具tab快捷键使用
- HTML5学习_day01(1)
- C++基础学习笔记----第六课(const和引用的扩展、重载函数和C方式编译的深入)
- html5三种引用方式 a标签得连接方式 以及表格的基本使用
- HTML 引用Css样式的四种方式
- HTML5学习_day01(4)--css内部样式之选择器
- html5学习记录08:认识css样式文字排版
- 以实践的方式学习C++ &(引用)
- HTML 引用Css样式的四种方式
- java学习个人笔记---java内存管理之Java对象的引用方式
- HTML5学习_day01(7)--css常用文本样式
- 正则学习:组的定义及引用方式
- HTML5学习_day01(6)--html颜色的几种写法
- TWaver HTML5学习笔记 —— 通过图层方式控制元素是否显示