1.行内样式

body内:

<p style="text-indent: 2em;color: red">
我是行内样式
</p>

2.内部样式表

body内:

<div class="inside">
我是内部样式表我是内部样式表
</div>

head内:

<style type="text/css">
.inside{
width: 300px;
height: 300px;
border: 1px solid blue;
}
</style>

3.外部样式表

body:

<div class="outside">
我是外部样式表
</div>

head内连接外部css样式代码:

<link rel="stylesheet" type="text/css" href="css/outside.css">

外部样式代码:

.outside{
width: 300px;
margin-bottom: 20px;
height: 200px;
background-color:#0f0;
}

优先级:行内样式>内部样式表>外部样式表

三种css样式表及其优先级的更多相关文章

  1. CSS三种插入样式表格式

    首先简单理解浏览器与网页的交互过程 CSS样式表(stylesheet) cascading style sheet 级联样式表 表现HTML或XHTML文件样式的计算机语言:包含对字体.颜色.边距. ...

  2. 三种CSS样式

    内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌入式和外部式三种. 内联式css样式表就是把css代码直接 ...

  3. HTML基础(三)——css样式表

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...

  4. CSS的三种样式表和优先级

    1.外部样式表当样式需要应用于很多页面时,外部样式表将是理想的选择.在使用外部样式表的情况下,你可以通过改变一个文件来改变整个站点的外观.每个页面使用 <link> 标签链接到样式表. & ...

  5. CSS:CSS样式表及选择器优先级总结

    我们在写网页的时候经常会遇到同一个HTML文件,使用了外部样式.内部样式以及内联样式,那么如果发生冲突时浏览器是怎么抉择的呢? 也会遇到这样的情况,在样式表中,对同一个HTML元素,我们有可能既用到了 ...

  6. CSS样式表优先级

    使用CSS样式表一共有2种方式:内部和外部,其中内部分为行内样式和嵌入式,外部分为导入式和链接式. 如果需要在不同的方式中设定同一个属性的时候,样式的优先级别就出现了. 测试代码如下: red.css ...

  7. 3月22日 html(三)css样式表

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确,但是可重用性差,冗余较多. 例 ...

  8. WEB入门三 CSS样式表基础

    学习内容 Ø        CSS的基本语法 Ø        CSS选择器 Ø        常见的CSS样式 Ø        网页中3种使用CSS的方式 能力目标 Ø        理解CSS的 ...

  9. css三种引入方式以及其优先级的说法

    css 三种引入方式 方式一:行间式 ​ 1.在标签头部的style属性内 ​ 2.属性值满足css语法 ​ 3.属性值用key:value形式赋值,value具有单位 ​ 4.属性值之间用 分号 : ...

随机推荐

  1. 【做题】51NOD1753 相似子串——哈希

    题意:两个字符串相似定义为: 1.两个字符串长度相等 2.两个字符串对应位置上至多有一个位置所对应的字符不相同 给定一个字符串\(s\),\(T\)次询问两个子串在给定的规则下是否相似.给定的规则指每 ...

  2. 【做题】zoj3649 Social Net——倍增

    这题是吴老师推荐的,于是我就去做了. 根据题意,在完成最大生成树后,对于树上从x到y的一条路径,求出最大的ck-cj(j<=k,ci为路径上第i个点的权值). 我一开始的想法是二分,记路径xy的 ...

  3. try finally 执行顺序问题

    有return的情况下try catch finally的执行顺序 在遇到Exception 并且没有catch的情况下finally语句块没有执行 System.exit(0),终止了 Java 虚 ...

  4. Java 多线程案例

    同步代码块 SynchronizedTest类,用来表示取票功能 package concurency.chapter6; public class SynchronizedTest implemen ...

  5. SQL 检查 Varchar 是否能转换为 NUMERIC

    https://bbs.csdn.net/topics/390480323 ISNUMERIC(size_long)=1 (IIF( ISNUMERIC(size_long)=1 AND ISNUME ...

  6. Nginx配置示例

    server {listen 6080;server_name local.boheadmin; location / {proxy_pass http://127.0.0.1:8087;} loca ...

  7. x=x+1,x+=1,及x++的效率哪个最高,为什么?

    x=x+1: 1.     读取右X的地址 2.     X+1 3.     读取左X的地址 4.     将右值传给左边的X x+=1: 1.     读取右边的x的地址 2.     X+1 3 ...

  8. Echarts 设置地图大小

    项目中要添加地图,默认地图太小,折腾半天终于找到解决方案. series: [ { //name: '香港18区人口密度', type: 'map', mapType: 'jiangsu', // 自 ...

  9. _itemmod_exchange_item

    物品强化说明 表说明 `item`物品ID `exchangedItem` 升级后的物品ID `upFlag` 物品等级模式0或1,一般为0 `reqId` 需求ID `chance` 升级几率 `c ...

  10. PCA-主成分分析(Principal components analysis)

    来自:刘建平 主成分分析(Principal components analysis,以下简称PCA)是最重要的降维方法之一. 1. PCA的思想 PCA顾名思义,就是找出数据里最主要的方面,用数据里 ...