一、使用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. 廖雪峰Java13网络编程-1Socket编程-1网络编程概念

    1.计算机网络 1.1 什么是计算机网络? 两台或更多计算机组成的网络 同一网络内的任意2台计算机都可以直接通信 所有计算机必须遵循同一种网络协议 1.2 什么是互联网 互联网是网络的网络 互联网采用 ...

  2. csps-模拟7778lrd两试

    题面:https://www.cnblogs.com/Juve/articles/11707775.html 位运算: 大力分类讨论 第一次发现若a^b=c,则c^b=a,c^a=b #include ...

  3. Centos--swoole平滑重启服务

    平滑重启: 已经打开的服务: 首先在server服务中为进程添加名字: /** * @param $server */ public function onStart($server) { swool ...

  4. 2019/10/17 CSP模拟 总结

    T1 补票 Ticket 没什么好说的,不讲了 T2 删数字 Number 很后悔的是其实考场上不仅想出了正解的方程,甚至连优化都想到了,却因为码力不足只打了\(O(n^2)\)暴力,甚至还因为细节挂 ...

  5. 简单数论 | Day3 部分题解

    A - The Euler function 来源:HDU 2824 计算[a,b]区间内的整数的欧拉函数值,需要掌握单个欧拉函数和函数表的使用. #include <iostream> ...

  6. <数据链接>常用网站收集

    1.互联网数据指数 百度指数:http://index.baidu.com/ 阿里指数:http://index.1688.com/ TBI腾讯浏览指数:http://tbi.tencent.com/ ...

  7. 短URL系统、301/302重定向

    短 URL 系统是怎么设计的?https://yq.aliyun.com/articles/87600 短网址(short URL)系统的原理及其实现 https://hufangyun.com/20 ...

  8. java线程队列

    工作原理 1.线程池刚创建时,里面没有一个线程.任务队列是作为参数传进来的.不过,就算队列里面有任务,线程池也不会马上执行它们. 2.当调用 execute() 方法添加一个任务时,线程池会做如下判断 ...

  9. Nginx报错汇总

    1.     Nginx 无法启动解决方法 在查看到 logs 中报了如下错误时: 0.0.0.0:80 failed (10013: An attempt was made to access a ...

  10. windows 遍历目录下的所有文件 FindFirstFile FindNextFile

    Windows下遍历文件时用到的就是FindFirstFile 和FindNextFile 首先看一下定义: HANDLE FindFirstFile( LPCTSTR lpFileName, // ...