一、使用style属性： 将style属性直接加在html标签里。

<标签 style="属性1: 设定值1; 属性2: 设定值2; ">

例如：

<td style="color:blue;font-size:9pt;font-family:'黑体';line-height:150%;">

这种用法的优点 是可灵巧应用样式于各标签中，但是缺点则是没有整篇文件的『统一性』。

二、使用style标签： 将样式规则写在<style>...</style>标签之中。

    <style type="text/css">

    <!--

    样式规则表

    -->

    </style>

例如：

 
    <style type="text/css">

    <!--

    BODY {

    　　color: BLUE;

    　　background: #FFFFCC;

    　　font-size: 9pt}

    TD, P {

    　　COLOR: GREEN;

    　　font-size: 9pt}

    -->

    </style>


通常是将整个的 <style>...</style>结构写在网页的<head> </head>部份之中。

这种用法的优点就是在于整篇文件的统一性，只要是有声明的标签即会套用该样式规则。

缺点就是在个别标签的灵活度不足。

三、使用 LINK标签：

将样式规则写在.css的样式档案中，再以<LINK>标签引入。

假设我们把样式规则存成一个example.css的档案，我们只要在网页中加入

<LINK REL=STYLESHEET TYPE="text/css" HREF="example.css">

即可套用该样式档案中所制定好的样式了。 通常是将LINK标签写在网页的<head></head>部份之中。

这种用法的优点就是在于可以把要套用相同样式规则的数篇文件都指定到同一个样式档案即可。缺点也是在个别文件或标签的灵活度不足。

四、使用@import引入： 跟LINK用法很像，但必须放在<STYLE>...</STYLE> 中。

    <STYLE TYPE="text/css">

    <!--

    　　@import url(引入的样式表的位址、路径与档名);

    -->

    </STYLE>

例如：

    <STYLE TYPE="text/css">

    <!--

    　　@import url(http://yourweb/ example.css);

    -->

    </STYLE>

引入样式表(css)的四种方式的更多相关文章

  1. JavaScript表单提交四种方式

    总结JavaScript表单提交四种方式 <!DOCTYPE html> <html> <head> <title>JavaScript表单提交四种方式 ...

  2. CSS学习（一）---使用CSS的四种方式

      1. 行内样式 例: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...

  3. sess文件编译输出css的四种方式以及使用

    sess文件输出css有下面四种方式: :nested(嵌套) :compact(紧凑) :expanded(展开) :compressed(压缩) 如何使用: sass --watch style. ...

  4. 引入css的四种方式

    1.内联式引用:直接用在标签上,但维护成本高 style='font-size:16px;color:#000000' 2.外部连接式引用:css代码与html代码分离,便于代码重复使用 <li ...

  5. C# MVC提交表单的四种方式（转）

    Mvc 提交表单的4种方法全程详解(转) 一,MVC  HtmlHelper方法 Html.BeginForm(actionName,controllerName,method,htmlAttribu ...

  6. 【总结-前台发送后台接收表单】MVC提交表单的四种方式

    https://www.cnblogs.com/chenwolong/p/Form.html#commentform 后台控制器接收前台表单参数三种方法: 一.普通参数 HTML标签name 和参数名 ...

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

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

  8. 《网页设计基础——CSS的四种引入方式详解》

    网页设计基础--CSS的四种引入方式详解     一.行内式:   规则: 1. 行内式是所有样式方法中最为直接的一种,它直接对HTML的标记使用style属性,然后将CSS代码直接写在其中.   格 ...

  9. HTML 引用Css样式的四种方式

    不才,只知道HTML引用CSS样式有四种方式,内部引用和外部引用各两种,因为老是忘记细节,记下了随时翻阅亦可方便如我般的初学者 内部引用方式1: 直接在标签内用 style 引用,如: <div ...

随机推荐

  1. Python3.6爬虫+Djiago2.0+Mysql --运行djiago环境

    1.安装djiago 模块 pip install Django  --默认安装最新的  安装完成以后可以python -m pip list 查看模块是否安装 2.创建项目及app 及生成目录 备注 ...

  2. VS code 设置侧边栏字体大小

    1.代码改写,进入默认安装的如下路径 C:\Users\Administrator\AppData\Local\Programs\Microsoft VS Code\resources\app\out ...

  3. Joomla - K2组件（文章管理扩展）

    一.下载 K2 进入 https://getk2.org/ ,点击DOWNLOAD K2 下载K2 下载完毕得到一个安装包 二.安装 K2 进入看后台,点击顶栏主菜单 扩展管理 -> 扩展安装 ...

  4. springboot 2 集成 redis 缓存 序列化

    springboot 缓存 为了实现是在数据中查询数据还是在缓存中查询数据,在application.yml 中将mybatis 对应的mapper 包日志设置为debug . spring: dat ...

  5. 2019-4-16-C#-使用反射获取私有属性的方法

    title author date CreateTime categories C# 使用反射获取私有属性的方法 lindexi 2019-4-16 10:13:3 +0800 2018-09-26 ...

  6. Luogu P3835 【模板】可持久化平衡树(fhq Treap)

    P3835 [模板]可持久化平衡树 题意 题目背景 本题为题目普通平衡树的可持久化加强版. 题目描述 您需要写一种数据结构(可参考题目标题),来维护一些数,其中需要提供以下操作(对于各个以往的历史版本 ...

  7. centos7服务器常见安装包准备

    内核相关配置 https://github.com/digoal/blog/blob/master/201611/20161121_01.md# vi /etc/sysctl.conf # add b ...

  8. HZOI20190818模拟25题解

    题面:https://www.cnblogs.com/Juve/articles/11372379.html A:字符串 其实是CATALAN数水题... 和网格一毛一样:https://www.cn ...

  9. Java的跨平台特性

    语言跨平台是编译后的文件跨平台,而不是源程序跨平台.Java源代码首先经过编译器生成字节码,即class文件,该class文件与平台无关,而class文件经过解释执行之后翻译成最终的机器码,这是平台相 ...

  10. LUOGU P1903 [国家集训队]数颜色 / 维护队列

    传送门 解题思路 带修莫队,第一次写,其实和普通莫队差不多,就是多了个时间轴,块分n^(2/3)最优,时间复杂度O(n^(5/3)). #include<iostream> #includ ...