css的书写格式一共有三种

行内样式:意思是在行内中写样式

例如说<p style="color:red">用行内样式编写我的颜色</p>

只适用于<body>(字体颜色和背景颜色)和<body>里面的标签,但不适用于<body>之外的例如:head,title,之类的标签

内嵌样式:使用style,把所有样式都卸载style里面。

例如说:

<head>

<style>

p{

color:red;

background:blue;

border:1px solid green;

}

</style>

</head>

<body>

<p>用内嵌方式编写我的样式</p>

</body>

外联样式:通俗点就是外部样式,使用link样式连接到外部的.css文件。

例如说:

<head>

  <link style="stylesheet" href="class.css" type="text/css" />

</head>

没错就是辣么简单,只需要把css样式写到另一个.css文本上然后仅需要link就可以在页面中显示出样式,但一定要注意文件路径!!!路径不对也是不可以滴.

个人推荐使用外联样式,做到了css与布局代码的分离,可以使代码可编辑性更高.加载更快.

引用css样式的书写格式的更多相关文章

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

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

  2. css样式的书写顺序及原理——很重要!

    记得刚开始学习前端的时候,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响.后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的一 ...

  3. css样式的书写顺序及原理

    刚开始学习前端的时候,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响.后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的一种方 ...

  4. 【转】css样式的书写顺序及原理——很重要!

    记得刚开始学习前端的时候,每次写css样式都是用到什么就在样式表后添加什么,完全没有考虑到样式属性的书写顺序对网页加载代码的影响.后来逐渐才知道正确的样式顺序不仅易于查看,并且也属于css样式优化的一 ...

  5. CSS样式表与格式布局

    样式表 CSS(Cascading Style Sheets  层叠样式表),作用是美化HTML网页. 内联样式表: 例:<p style="font-size:10px;" ...

  6. React中引用CSS样式的方法

    相对于html中引用css的三种方法,react中也有三种方法,一一相对: 1. 行内样式:直接在组件内部定义 <div style={{width:'20px',height:'30px'}} ...

  7. CSS样式表书写位置

    一.内嵌式写法:样式只作用于当前文件,没有真正实现结构表现分离. <head> <style type=”text/css”> 样式表写法 </style> < ...

  8. Java 新手学习 CSS样式列表 排版 格式布局

    1,样式表分为  内联样式表   内嵌样式表  外部样式表  三种. 内联样式表是直接写在标签里面的  比如 <p style=“”></p>  <div style=& ...

  9. 如何引用CSS样式表

      如何使用样式 当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化.有以下三种方式来插入样式表: 1.外部样式表 当样式需要被应用到很多页面的时候,外部样式表将是理想的选择.使用外部样式 ...

随机推荐

  1. Oralce导入数据库出现某一列的值太大

    这是由于导出的文件所运行的Oracle,和导入所运行的Oracle机器字符集不相同导致的,在UTF-8中有的汉字占三个字节, 并不是所有的都占两个字节,

  2. [Ynoi2016]镜中的昆虫

    题目大意: 给定一个序列,有2个操作: 1. 区间覆盖.2. 区间数颜色. 解题思路: 珂朵莉树+树套树. 看到区间覆盖当然想到珂朵莉树然而这是Ynoi 所以我们得优化掉珂朵莉树那个暴力过程. 考虑对 ...

  3. [luogu1155 NOIP2008] 双栈排序 (二分图染色)

    传送门 Description Input 第一行是一个整数 n . 第二行有 n 个用空格隔开的正整数,构成一个 1−n 的排列. Output 共一行,如果输入的排列不是"可双栈排序排列 ...

  4. rsync增量同步标志位详细解释

    rsync非常强大,下面是我用rsync做目录备份时用到的参数: rsync -ruPi -plEt /home/op/photo/ /remote_backup/photo/ --dry-run - ...

  5. 【[Offer收割]编程练习赛10 C】区间价值

    [题目链接]:http://hihocoder.com/problemset/problem/1483 [题意] 中文题 [题解] 二分最后的答案; 二分的时候; 对于每一个枚举的值x; 计算小于等于 ...

  6. elasticsearch实战 中文+拼音搜索

    需求 雪花啤酒  需要搜索雪花.啤酒 .雪花啤酒.xh.pj.xh啤酒.雪花pj ik导入 参考https://www.cnblogs.com/LQBlog/p/10443862.html,不需要修改 ...

  7. javascript-jsonp的用法

    原文地址 $.ajax({ type: "get", async: false, url: "ajax.ashx", dataType: "jsonp ...

  8. 可回味的js代码段

    1,关于bind()----- var name="global"; var person={ name:"person", hello:function(st ...

  9. HDU 4517

    EASY题,直接统计(1,1)到(i,j)的黑点个数,然后计算出以(i,j)点为右下角的矩形内的黑点个数是x*y即可. 注意当x==y时不要重复统计. #include <iostream> ...

  10. [Linux]RedHat Linux 忘记rootpassword该怎样又一次设置password

    1. 开机在出现grub画面,按e键,例如以下图所看到的: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvU3VubnlZb29uYQ==/font/5a6 ...