简介：

  • CSS(Cascading Style Sheets)：层叠样式表，它用来控制HTML标签的样式，给网页结构穿衣服~
  • CSS的编写格式是键值对的形式  ->  格式：属性名 : 属性值；
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>have a try</title>

         <style>

         /*和html在body开工不同的是，css在head里面自由飞翔*/

         /* sublime里用ctrl+/快捷注释 */

         /* 标签{样式:值;样式:值;样式:值;} */ 

         /*示例设置段落的部分内容*/

        div{

                 color:#12F062;

                 background-color:green;

                 font-size:15px;
            }

         </style>

</head>

<body>

        <div>

            xxxxxxx

        </div>

</body>

</html>

三种CSS样式：

外联式、内嵌式、行内式

  • 行内式与内嵌式都没有把html与css分离，外联式分离
  • 开发过程使用优先级 外联式，内嵌式，行内式
  • 样式权重 行内式，内嵌式， 外联式

外联式

(也可称为外部式)就是把css代码写一个单独的外部文件中，这个css样式文件以“.css”为扩展名，

在<head>内（不是在<style>标签内，不用写<style>标签）使用<link>标签将css样式文件链接到HTML文件内，在HTML代码中使用，如下面代码：

<link href="base.css" rel="stylesheet" type="text/css" />
  • css样式文件名称以有意义的英文字母命名，如 main.css。
  • rel="stylesheet" type="text/css" 是固定写法不可修改。
  • <link>标签位置一般写在<head>标签之内。

内嵌式

就是可以把css样式代码写在<style type="text/css"></style>标签之间。如下代码将把多个<span>标签中的文字统一设置为红色：

<style>

     span{

                color:red;

             }

</style>

嵌入式css样式必须写在<style></style>之间，并且一般情况下内嵌式css样式写在<head></head>之间。

行内式

把css代码直接写在现有的HTML标签（如p,span...etc）中，如：

<p style="color:red; font-size:12px">这里文字是红色</p>
  • 注意要写在元素的开始标签里，下面这种写法是错误的： <p>这里文字是红色。</pstyle="color:red;font-size:12px">
  • 并且css样式代码要写在style=""双引号中

学习参考文档：

HTML快速入门：css

CSS 最核心的几个概念

CSS：概念和三种样式的更多相关文章

  1. 转载：CSS的组成,三种样式(内联式,嵌入式,外部式),优先级

    (仅供自己备份) 原文地址:http://blog.csdn.net/chq11106004389/article/details/50515717 CSS的组成 选择符/选择器+声明(属性+值) 选 ...

  2. 《转载》CSS中的三种样式来源：创作人员、读者和用户代理

    CSS中的样式一共有三种来源:创作人员.读者和用户代理,来源的不同会影响到样式的层叠方式,很多第一次学习CSS的朋友,对这三种来源可能会存在一些困惑,下面我写一下自己的理解,若有错误的地方还请指正. ...

  3. CSS选 择器 三种样式

    一.CSS三种样式 代码 宽度 高度 实线 颜色  A内联样式是优先级最高的方式 px必须写 A:内联式  弊端:代码多很乱 <body> <div class="divc ...

  4. CSS的三种样式：内联式，嵌入式，外部式以及他们的优先级

    从CSS 样式代码插入的形式来看基本能够分为下面3种:内联式.嵌入式和外部式三种. 1:内联式css样式表就是把css代码直接写在现有的HTML标签中,如以下代码: <p style=" ...

  5. css三种样式表写法

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

  6. CSS 的三种样式 内联 内部 外部

    CSS:层叠样式表的缩写 就是 Cascading Style Sheets Cascading Style Sheets : 层叠样式表 优先级问题 :遵守就近原则  内联> 内部>外部 ...

  7. CSS中的三种基本的定位机制（普通流、定位、浮动）

    一.普通流 普通流中元素框的位置由元素在XHTML中的位置决定.块级元素从上到下依次排列,框之间的垂直距离由框的垂直margin计算得到.行内元素在一行中水平布置. 普通流就是html文档中的元素如块 ...

  8. HTML三种样式引入方式

    HTML三种样式引入方式   HTML有三种样式引入方式:行内样式(inline Styles).嵌入式样式表(Embedded Style Sheets).外部样式表(External Style ...

  9. 前端js,css文件合并三种方式,bat命令

    前端js,css文件合并三种方式,bat命令 前端js文件该如何合并三个方式如下:1. 一个大文件,所有js合并成一个大文件,所有页面都引用它.2. 各个页面大文件,各自页面合并生成自己所需js的大文 ...

随机推荐

  1. 基于window自带功能生成目录树

    在写文档时,生成目录树是非常有必要的,可以清晰明了地用图阐释一些事情. 1 生成目录树 1.1 方案1:操作繁(只显示文件夹) 1 - win + R 2 - 输入 “CMD” ,打开命令提示窗口“ ...

  2. 初识HTTPS

    初识HTTPS HTTPS也被叫做“基于TLS的HTTP,基于SSL的HTTP,HTTP安全“,它是一个在Internet上广泛使用的计算机网络安全通信协议. 即HTTPS是HTTP的安全版本,在了解 ...

  3. URLEncoder 和URLDecoder

    通常在字符串的编码转换上,可以使用这两个类: public static void main(String[] args) { String str = "你好吗?我很好!"; t ...

  4. java 注解默认值

    package com.zejian.annotationdemo; import java.lang.annotation.ElementType; import java.lang.annotat ...

  5. 解决：ngxin做http强制跳转https，接口的POST请求变成GET

    域名配置了http强制跳转htpps后发现app发起post请求会出现405错误. 所以怀疑是http强制跳转https出现了问题.修改nginx配置如下即可解决: server { listen ; ...

  6. android:onClick都做了什么

    同步发表于 http://avenwu.net/viewinject/2015/01/28/android_onclick/ 相信大家都知道在layout里面可以给view写android:onCli ...

  7. matlab中如何将视频保存成图像

    利用MATLAB将视频的每一帧保存成一幅图像,并自动命名.本文方法简单,容易学习. 首先,读入视频.代码如下: mov = VideoReader('xxxxxx.avi'); % 将xxxxxx.a ...

  8. Kubernetes集群部署之一系统环境初始化

    安装版本: centos version: 7.4 docker version: 18.03.1-ce kubectl version: v1.10.1 etcdctl version: 3.2.1 ...

  9. MySQL5.7.19 服务挂掉 自动关闭 mysqld got exception 0xc000001d win 2008R2

    在mysql 官网看到mysqld got exception 0xc000001dThis error message occurs because you are also using a CPU ...

  10. redis最大缓存和回收策略