**CSS语法**

CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明。选择器通常是您需要改变样式的 HTML 元素。

  1. selector {declaration1; declaration2; ... declarationN }

每条声明由一个属性和一个值组成。
属性（property）是样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。

  1. selector {property: value}

例如下面这行代码的作用是将 h1 元素内的文字颜色定义为红色，同时将字体大小设置为 14 像素。
在这个例子中，h1 是选择器，color 和 font-size 是属性，red 和 14px 是值。

  1. h1 {color:red; font-size:14px;}

**引入CSS样式**

如何插入样式表，当读到一个样式表时，浏览器会根据它来格式化 HTML 文档。插入样式表的方法有三种：外部样式表、内部样式表和内联样式。

1.外部样式表

当样式需要应用于很多页面时，外部样式表将是理想的选择。在使用外部样式表的情况下，你可以通过改变一个文件来改变整个站点的外观。每个页面使用 <link> 标签链接到样式表。<link> 标签在（文档的）头部：

  1. <head><link rel="stylesheet" type="text/css" href="site.css" /></head>

2.内部样式表
当单个文档需要特殊的样式时，就应该使用内部样式表。你可以使用 <style> 标签在文档头部定义内部样式表，就像这样:

  1. <head>
  2. <style type="text/css">
  3. p {margin-left: 20px;}
  4. body {background-image: url("images/test.gif");}
  5. </style>
  6. </head>

3.内联样式由于要将表现和内容混杂在一起，即HTML代码和CSS代码混编，这样会不利于文档结构，并且不容易维护，所以一般不要使用这种方式引入样式。例如改变段落的颜色和左外边距：

    1. <p style="color: red; margin-left: 20px;">
    2. This is a paragraph
    3. </p>

CSS最基础的语法和三种引入方式的更多相关文章

  1. CSS【03】：CSS 基础选择器与三种引入方式

    基础选择器 选择器:css 选择 html 标签的一个工具,是将 css 与 html 建立起联系,那么 css 就可以控制 html 样式 选择器其实就是给 html 标签起名字 标签选择器 作用: ...

  2. html(常用标签,标签分类)，页面模板， CSS(css的三种引入方式)，三种引入方式优先级

    HTML 标记语言为非编程语言负责完成页面的结构 组成: 标签:被<>包裹的由字母开头,可以结合合法字符( -|数字 ),能被浏览器解析的特殊符号,标签有头有尾 指令:被<>包 ...

  3. python全栈开发day38-css三种引入方式、基础选择器、高级选择器、补充选择器

    一.昨日内容回顾 div:分割整个网站,很多块 (1)排版标签 (2)块级标签 独占一行 可以设置高和宽,如果不设置宽高,默认是父盒子的宽 span: (1) 小区域 (2)文本标签 (3)在一行内显 ...

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

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

  5. css三种引入方式以及其优先级的说法

    css 三种引入方式 方式一:行间式 ​ 1.在标签头部的style属性内 ​ 2.属性值满足css语法 ​ 3.属性值用key:value形式赋值,value具有单位 ​ 4.属性值之间用 分号 : ...

  6. js介绍，js三种引入方式，js选择器，js四种调试方式，js操作页面文档DOM（修改文本，修改css样式,修改属性）

    js介绍 js运行编写在浏览器上的脚本语言(外挂,具有逻辑性) 脚本语言:运行在浏览器上的独立的代码块(具有逻辑性) 操作BOM 浏览器对象盒子 操作DOM 文本对象 js三种引入方式 (1)行间式: ...

  7. 前端 CSS 三种引入方式

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

  8. css-1,css的三种引入方式 基本选择器

    <!-- (1)CSS 层叠样式表 作用:修饰网页结构 (2)css的三种引入方式 权重: 优先级高 权重大 谁在页面谁的权重大 - 行内样式 注意:行内样式的优先级是最高的 - 内接样式 - ...

  9. 006 CSS三种引入方式

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

随机推荐

  1. 前后端分离 token和cookie对比

    HTTP协议本身是无状态的,所以需要一个标志来对用户身份进行验证 1.cookie 用户登录成功后,会在服务器存一个session,同时发送给客户端一个cookie,这个cookie里面有唯一标识该用 ...

  2. SpringCloud-Eureka-Provider&Consumer

    Eureka-Provider 服务的提供者 新建一个服务提供者项目 1.导入pom文件 <properties> <java.version>1.8</java.ver ...

  3. mybatis where 中in的使用

    当我们使用mybatis时,在where中会用到 in 如: where name in ('Jana','Tom'); 我们可以在sql中直接写 name in ('Jana','Tom') 或者 ...

  4. 记录使用node启用微信公众平台服务器配置

    在微信公众平台的基本信息里面的,修改服务器配置后会有下面的界面. EncodingAESKey是随机生成的,加密方式根据需要自己选择. 关于URL和Token: URL:填写之后会向这个URL发送一个 ...

  5. docker-compose启动报错：Creating network "soft_default" with the default driver ERROR: cannot create network e5b60fc347db868e471b61ea185fd24e3ea7e2730149d91ad70baf29732aaff0 (br-e5b60fc347db): conflicts wi

    docker-compose启动容器时出现报错 Creating network "soft_default" with the default driver ERROR: can ...

  6. linux性能分析工具Procs

  7. Java疯狂讲义笔记——内部类

    [定义]内部类:定义在其它类内部的类.外部类:包含内部类的类,也称 宿主类.局部内部类:定义在方法里的内部类. [接口内部类]接口中也可以定义内部类,必须为public static修饰(自动添加), ...

  8. C Primer Plus 学习 第三章

    这里只记录我自己以前不懂得地方,明白的地方就略过了 位  字节  字 位    0,1 字节  8位  也就有8位0,1的组合   2的8次方的组合 字      设计计算机时给定的自然存储单元.8位 ...

  9. java23种设计模式（三）-- 适配器模式

    一.适配器模式 转载:https://www.cnblogs.com/V1haoge/p/6479118.html 适配器就是一种适配中间件,它存在于不匹配的二者之间,用于连接二者,将不匹配变得匹配, ...

  10. 记录每个action执行时间

    import org.apache.commons.lang.time.StopWatch; import org.aspectj.lang.JoinPoint; import org.aspectj ...