首先简单理解浏览器与网页的交互过程

CSS样式表（stylesheet）

　　cascading style sheet 级联样式表

　　表现HTML或XHTML文件样式的计算机语言：包含对字体、颜色、边距、高度、背景图片、网页定位等设定

　　css优势：内容于表现分离

　　网页的表现统一，容易修改

　　丰富的样式，使得页面布局更加灵活

　　减少网页的代码量，增加网页的浏览速度，节省网络带宽

　　运用独立于页面的css有利于网页被搜索引擎收录

插入CSS样式表分为三种：

外部样式表(External style sheet)

链接式与导入式的区别

<link rel=”stylesheet” type=”text/css”

href=”path”>

<style type="text/css">

@import url(path);

</style>

<link/> 标签属于XHTML，@import是属于CSS2.1

使用<link/> 链接的CSS文件先加载到网页当中再进行编译显示

使用@import导入的CSS文件，客户端显示HTML结构，再把CSS文件加载到网页当中

@import是属于CSS2.1特有的，对不兼容CSS2.1的浏览器是无效的
内部样式表(Internal style sheet)

CSS代码写在<head>的<style>标签中

<style>

h1{color:green;}

</style>

优点：方便在同页面中修改样式

缺点：不利于在多页面间共享复用代码及维护，对内容与样式的分离也不够彻底。
内联样式(Inline style)

使用style属性引入CSS 样式

<h1 style=”color:red;”>style属性的应用</h1>

<p style=”font-size:14px;color:green;”>直接在HTML标签中设置样式</p>

CSS三种插入样式表格式的更多相关文章

  1. CSS 四种引入样式表优缺点分析

    CSS 四种引入样式表 CSS 有四种方式引入样式表,如下: 外部样式表 内部样式表 行内样式表 导入样式表 外部样式表优缺点 优点 实现了结构与表现的代码完全分离 方便复用及维护 因为分离到各自独立 ...

  2. (一)CSS三种插入方式

    CSS概述 CSS(Cascading Style Sheets)指层叠样式表,样式定义了如何显示HTML元素. 样式通常存储在样式表中,样式与HTML分离解决了内容与表现分离的问题. 多个样式表可以 ...

  3. 你真的知道css三种存在样式（外联样式、内部样式、内联样式）的区别吗？

    css样式在html中有三种存在形态: 内联样式:<div style="display: none"></div> 内部样式: <style> ...

  4. css三种样式表写法

    css三种样式表:1.内嵌样式表: <head>  <style type="text/css">   样式表写法  </style> < ...

  5. CSS三种样式

    CSS 指层叠样式表 (Cascading Style Sheets): 1 内联样式:无法复用,在元素style内写 ,很少使用: 2 内部样式:在head元素内style属性内写,此样式可以被当前 ...

  6. CSS三种写法的优先级

    在HTML文件中引入CSS样式有三种方法: 外部样式:通过link标签引入CSS样式: 内页样式:写在HTML页面里面的style标签里面: 行内样式:写在对应标签的style属性里面. 我知道一般情 ...

  7. 前端 CSS 三种引入方式

    CSS三种引入方式 行内样式 内接样式 外部样式 链接式 导入式 行内样式 就是在标签加上style属性设置样式 <!DOCTYPE html> <html lang="e ...

  8. 006 CSS三种引入方式

    CSS三种引入方式 一.三种方式的书写规范 1.行间式 <div style="width: 100px; height: 100px; background-color: red&q ...

  9. Python 45 css三种引入方式以及优先级

    一:css三种引入方式 三种方式为:行间式 | 内联式 | 外联式 行间式   1.在标签头部的style属性内  2.属性值满足的是css语法  3.属性值用key:value形式赋值,value具 ...

随机推荐

  1. Linux之目录结构配置

    因为 Linux 的开发者实在太多了,如果每个人都发展出属于自己的目录配置方法, 那么将可能会造成很多管理上的困扰.所以,就有一个叫做Filesystem Hierarchy Standard (FH ...

  2. LiveBindings --- 把对象之间的属性绑定起来

    有了 FireMonkey 框架,它不同于 VCL ,以往的数据感知控件不能放在它上面,所以 XE2 提供了 LiveBindings 功能作为替代方案.另外它也是个通用的基础设施,同样可用于传统的V ...

  3. c++11模拟boost元占位符placeholder

    准备实现meta programming的fold函数,发现自己缺少占位符实现,这样传入fold的transform op类(元函数)都不得不另外写个外覆类,其实我觉得没啥不好,简单直接,说实话干扰什 ...

  4. 关于Mybatis的那点事

    1.实现关联表查询 1.1. 一对一关联 1). 提出需求 根据班级id查询班级信息(带老师的信息) 2). 创建表和数据 CREATE TABLE teacher( t_id INT PRIMARY ...

  5. 【mysql】mysql触发器使用示例

    mysql触发器 时间点:before/after 触发事件: update/delete/insert 时间点+触发事件:构成一个完整的触发器的触发时机: 一个触发时机最多只能由1个Trigger: ...

  6. servlet cdi analysis

    CDI中最令人兴奋的功能是允许每个人在Java EE平台中编写强大的扩展性功能,甚至于改变其核心本身.这些扩展性功能是可以完全移植到任何支持CDI的环境中. CDI的一些主要特性 1.类型安全:CDI ...

  7. 一入爬虫深似海，从此游戏是路人！总结我的python爬虫学习笔记！

    前言 还记得是大学2年级的时候,偶然之间看到了学长在学习python:我就坐在旁边看他敲着代码,感觉很好奇.感觉很酷,从那之后,我就想和学长一样的厉害,就想让学长教我,请他吃了一周的饭,他答应了.从此 ...

  8. Redis详解入门篇

    Redis详解入门篇 [本教程目录] 1.redis是什么2.redis的作者3.谁在使用redis4.学会安装redis5.学会启动redis6.使用redis客户端7.redis数据结构 – 简介 ...

  9. maven构建SSM框架中pom.xml文件配置

    <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/20 ...

  10. Java中的反射总结

    反射是获取运行时类信息,即常量区中的Class信息. 要获取类信息,必然需要依据,不然系统怎么指定你要获取那个类信息, 类信息在java中就是Class类的一个对象,它是一个java类抽象,换句话说它 ...