首先,我们要知道CSS是什么。简单地说,CSS层叠样式表是用来表现HTML或XML等文件样式的一种语言,它可以对页面中所有元素的位置、大小、颜色等进行编辑,来静态的修饰网页,规范页面的排版布局。那么CSS如何与对应的HTML文件进行连接从而起到作用呢?这就是本篇博客的主要内容。

  应用CSS样式表的三种方式:行内样式表、内部样式表、外部样式表

    1.行内样式表:是用style属性实现,写在<body></body>内部的样式表

        特点:1.讲CSS代码与HTML代码完全杂糅在一起,不符合W3C关于“内容与表现分离”的编码规则,不利于后期维护

           2.优先级最高,一般用的测试

 <body>
<div style="样式;样式;">
</div>
</body>

    2.内部样式表:是把<style type="text/css"></style>写在<head></head>头部的样式表

        特点:1.将CSS与HTML文件分离,但不彻底,无法实现样式复用性

           2.优先级<行内样式表

<head>
<meta charset="UTF-8">
<title>应用CSS的三种方式</title> <style type="text/css"> </style>
</head>

    3.外部样式表:是重新建立一个CSS文件,命名一般与对应的HTML文件名字一样;需要在HTML文件的<head></head>头部加一个<link>标签用于连接

        <link>标签的属性有:rel:声明被连接文档与当前文档的关系

                   href:被连接文档的地址,必填!

                   type:被连接文档的类型,可以选择是CSS或者JS或者其他

        特点:1.将CSS与HTML彻底分离,方便后期复用和维护

           2.优先级<内部样式表

<link rel="stylesheet" type="text/css" href="D6-CSS样式表(连接方式).css">

CSS样式之连接方式的更多相关文章

  1. CSS 样式的使用方式、选择器

    在html中使用css的三种方式: 1.行内样式:同过元素的style属性来设置 <p style="font-size:20px; color:red">hello& ...

  2. CSS样式的插入方式

    1.外部样式: 当样式需要应用于很多页面时,外部样式表将是理想的选择.<head> <link rel="stylesheet" type="text/ ...

  3. 四种CSS样式的引入方式

    准备 1.首先准备一个html文件:test.html,不建议使用记事本创建文件,建议使用Notepad++来创建并编辑文件,注意编码格式为:以UTF-8无BOM格式编码,否则会出现中文乱码,内容如下 ...

  4. JS设置CSS样式的集中方式

    1. 直接设置style的属性  某些情况用这个设置 !important值无效 如果属性有'-'号,就写成驼峰的形式(如textAlign)  如果想保留 - 号,就中括号的形式  element. ...

  5. CSS样式表引用方式

    最近讲课中,有些学员对调用样式表老是有含糊不清?大体说来有四种方式: 1.外部文件引用方式;(推荐使用) 2.使用@import引用外部CSS文件; 3.内部文档头方式也叫内嵌法调用; 4.直接插入式 ...

  6. 前端开发---css样式的使用方式

    css使用方式: 1.内联样式表: <body style="background-color:green" margin:0 ; padding:0;> 2.嵌入式样 ...

  7. CSS样式的引入方式

    test.css div{ color:yellow; } 在html中引入 <link href="test.css" type="text/css" ...

  8. html5 中的 css样式单 的 两种调用方式的区别

    在 html5 中 使用 css 样式单的方式 有4种: 1.链接外部样式文件:将样式文件 彻底与 html 文档分离,样式文件需要额外引入,这种情况下 一批样式 可以控制多份文档.对于好多文件都共有 ...

  9. web前端(7)—— 了解CSS样式,引入css样式的方式

    CSS 在前面大概的介绍了css,从本片博文开始,会详细的介绍它,在最开始介绍web前端时,打开百度首页,当时我提出了一个问题,为什么百度首页的输入框可以放在正中间,就是由于有css的控制,我们可以打 ...

随机推荐

  1. 栅栏——CyclicBarrier

    栅栏CyclicBarrier和闭锁CountDownLatch类似,可以说它们都是用来计数,都能阻塞一组线程知道某个事件发生.不同的是闭锁用于等待事件,而栅栏用于等待其他线程. 在前一篇<Co ...

  2. VR全景加盟-了解VR就来全景智慧城市

    关于什么是真正的VR说了这么多,面对刚刚起步的VR,如何辨别判断一个真正的VR形式呢.除了我们所说几个参数或者大家关注的眩晕感.临场感,真正的VR究竟带给大家什么样的特性呢?这个就要从VR的本质谈起. ...

  3. 20155212 实验四 《Android程序设计》 实验报告

    20155212 实验四 <Android程序设计> 实验报告 (一)Android Stuidio的安装测试 参考<Java和Android开发学习指南(第二版)(EPUBIT,J ...

  4. 白话讲session

    什么是session Session一般译作会话,牛津词典对其的解释是进行某活动连续的一段时间.从不同的层面看待session,它有着类似但不全然相同的含义.比如,在web应用的用户看来,他打开浏览器 ...

  5. redis入门指南-第7章-管理

    7.1 持久化 1.RDB方式 2.AOF方式 Redis 持久化: 提供了多种不同级别的持久化方式:一种是RDB,另一种是AOF. RDB 持久化可以在指定的时间间隔内生成数据集的时间点快照(poi ...

  6. 016 多对多关联映射 单向(many-to-many)

    一般的设计中,多对多关联映射,需要一个中间表 Hibernate会自动生成中间表 Hibernate使用many-to-many标签来表示多对多的关联 多对多的关联映射,在实体类中,跟一对多一样,也是 ...

  7. Git添加远程库和从远程库中获取(新手傻瓜式教学)

    一.    Git添加远程库 1.在本地新建一个文件夹,在该文件夹使用Git工具,运行$ git init,将该文件夹变为本地Git仓库,同时会生成一个隐藏的.git文件夹. 2.在该文件夹中用Not ...

  8. LAMP的搭建与简易配置(apache,php已module方式结合)

    测试所用环境:centos7.2 apache php 所在主机IP:9.110.187.120 mariadb 所在主机IP:9.110.187.121 第一部分:环境搭建 yum安装软件包 其中a ...

  9. Nim 博弈和 sg 函数

    sg 函数 参考 通俗易懂 论文 几类经典的博弈问题 阶梯博弈: 只考虑奇数号楼梯Nim,若偶数楼梯只作容器,那么游戏变为Nim.题目 翻转硬币: 局面的SG值为局面中每个正面朝上的棋子单一存在时的S ...

  10. 在linux下利用信号量实现一个写者线程多个读者线程

    #include<pthread.h> #include<string.h> #include<stdlib.h> #include<stdio.h> ...