网页中引用CSS样式

内联样式

行内样式表

外部样式表

    ..链接式  

    ..导入式

内嵌方式

style标签

<!doctype html>
<html>
<head>
<meta charset="utf8">
<style>
p {
color: red;
}
</style>
</head>
<body>
<p>这是一个p标签!</p>
</body>
</html>

行内样式

<!doctype html>
<html>
  <head>
    <meta charset="utf8">
  </head>
  <body>
    <p style="color: blue;">这是一个p标签!</p>
  </body>
</html>


外联样式表-链接式

link标签

index.css

p {
color: green;
}
注意:这里是另建一个css文件

然后在HTML文件中通过link标签引入:

<!doctype html>
<html>
<head>
<meta charset="utf8">
<link rel="stylesheet" href="index.css">
</head>
<body>
<p>这是一个p标签!</p>
</body>
</html>

外联样式表-@import url()方式 导入式

了解即可。

index.css

@import url(other.css)

注意:
@import url()必须写在文件最开始的位置。

链接式与导入式的区别

1、<link/>标签属于XHTML,@import是属性css2.1
2、使用<link/>链接的css文件先加载到网页当中,再进行编译显示
3、使用@import导入的css文件,客户端显示HTML结构,再把CSS文件加载到网页当中
4、@import是属于CSS2.1特有的,对于不兼容CSS2.1的浏览器来说就是无效的
 

2.css的引入方式的更多相关文章

  1. CSS的引入方式

    再用HTML编写的文本中,有是没能达到我们想要的效果,此时此刻我们可以用过引用CSS来控制!这不仅使得效果好而且代码层次清晰.CSS的引入方式可以分为四类: 1.链入外部样式表,就是把样式表保存为一个 ...

  2. python 全栈开发,Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  3. CSS的引入方式和样式

    CSS的引入方式和样式 一.样式 行内样式 内接样式 外接样式(1.链接式 2.导入式) <!--行内样式--> <div> <p style="color: ...

  4. 前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器

    前端1-----CSS层叠样式表了解,css的引入方式,三大选择器(标签,类,id),高级选择器 一丶CSS简介    叠样式表(英文全称:Cascading Style Sheets)是一种用来表现 ...

  5. Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  6. 前端(二)—— CSS的引入方式、长度与颜色单位、常用样式、选择器

    CSS的引入方式.长度与颜色单位.常用样式.选择器 一.CSS的三种引入方式 1.行间式 <!doctype html> <html> <head> <met ...

  7. CSS的引入方式和复合选择器

    CSS的引入方式 样式表 优点 缺点 范围 行内样式表 书写方便 结构样式混写 控制一个标签 内部样式表 部分结构和样式相分离 没有彻底 控制一个页面 外部样式表 完全实现结构和样式分离 需要引入 控 ...

  8. css样式引入方式,及常用设置标签样式

    一. 三种样式引入方式   1. 内联式-直接写在div标签中,不推荐用 <div style="color:red;font-size:20px;font-family:'Micro ...

  9. CSS 从入门到放弃系列:CSS的引入方式

    css的四种引入方式 内联方式(行间样式) <div style="width:100px;height: 100px; background-color: red"> ...

  10. 5.CSS的引入方式

    CSS的三种样式表 按照CSS样式书写的位置(或者引入的方式),CSS的样式表可以分为三大类: 1.行内样式表(行内式) <div style="color:red: font-siz ...

随机推荐

  1. notepad++正则表达式删除所有行某字符开始之前或者之后所有字符

    删除S 之后的所有字符用:s.*$ 删除S 之前的所有字符用:^.*s

  2. 仿微信-ActionSheet

    有时候我们在开发中,系统提供的actionsheet 不能满足我们的需求,所以,今天就做一个类似微信中的,支持多个按钮,我见有的人用的是个tableview,也可以,但是有点麻烦. 效果图: Acti ...

  3. 为单个项目添加多个远程仓库(Git操作)

    书写代码时,有时候需要维护多个仓库,这时候就面对了这个需求,解决方法如下: $ git remote add github ****** $ git remote add mayun ****** 书 ...

  4. 14-python登入教务网(python+bs4)

    用request先得到到session对象,用其去放送请求,会自动保存cookie. 模拟有验证码的登入步骤: 1.发送请求登入页面: 2.分析验证码的地址,以及要将登入请求发往的地址(可以先输入错的 ...

  5. .net 多线程同步的相关知识点

    在多线程开发中,共享对象的同步是经常遇到的问题,以下总结了C#中线程同步的几种技术: 1,InterLocked原子操作 Decrement(ref int location);递减1 Add(ref ...

  6. line1: 1: Syntax error: word unexpected (expecting ")")

    行时错误:line1: 1: Syntax error: word unexpected (expecting ")") 查看Makefile编译规则,可能由于依赖关系造成编译器使 ...

  7. jQuery中deferred对象的使用(一)

    在jquery1.5之后的版本中,加入了一个deferred对象,也就是延迟对象,用来处理未来某一时间点发生的回调函数.同时,还改写了ajax方法,现在的ajax方法返回的是一个deferred对象. ...

  8. python3--json序列化

    # Auther: Aaron Fan # 把数据存入到一个文件中 # json格式的数据几乎可以通用语任何编程语言,但是仅仅只是简单的格式转换# 比如:字典.列表.元组.字符串这些,像函数.类就不可 ...

  9. 轻松搭建持续集成工具jenkins

    1.Jenkins介绍1)什么是持续集成随着软件开发复杂度的不断提高,团队开发成员间如何更好地协同工作以确保软件开发的质量已经慢慢成为开发过程中不可回避的问题.尤其是近些年来,敏捷(Agile) 在软 ...

  10. windows cmd命令相关知识和经验的碎片化记录

    1.循环遍历当前文件夹下的所有*.dll文件,并打印其绝对路径和相对路径 ``` for /f "tokens=*" %%a in ('dir /s/b/a-d "*.d ...