层叠样式表CSS

Cascading Style Sheets

用来为网页创建样式表，通过样式表对网页进行装饰。

所谓层叠，就是将网页想象成一层一层的结构，层次高的将覆盖层次低的。

CSS可以为网页的每个层次设置样式。

语法：    

选择器｛声明块儿｝

声明为 “名：值；”

选择器｛

声明1；

声明2；

｝

分类：

1. 内联样式表

直接写到标签的style属性当中，只对该标签作用。

<p style="color:red; font-size:24px;">考试重点</p>

特点：作用于单一标签，复用率低；若标签过多地使用，不美观。

2. 内部样式表

将样式表写在<head>中的<style>标签中。

<style type="text/css">

p{

color:red;

font-size:24px;

}

</style>

特点：使得表现与结构在HTML中实现分离。

3. 外部样式表

写在一个.css文件中，多个html网页可以链接并应用。

@charset "utf-8"

/* 这是一个css注释，同c语言注释 */

p{

color:red;

font-size:24px;

}

在index.html的head中链接外部css文件，应用其样式：

<head>

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

</head>

特点：结构与表现完全分离；样式可复用；利用浏览器的缓存可以加快访问速度。

__x__(16)0906第三天__层叠样式表CSS简介的更多相关文章

  1. __x__(8)0906第三天__乱码问题

    需要知道: 计算机只认 0 1 任何内容,计算机都会以 0 1 去存储 所以 0 1 与内容的编码方式/解码方式需要依照一定的规则,实现 0 1 与内容之间的转换. 字符集:一定的规则,由编码/解码采 ...

  2. __x__(9)0906第三天__常见的标签

    <!doctype html> <html> <head> <meta charset="utf-8" /> <title&g ...

  3. __x__(10)0906第三天__字符实体（转义字符）

    实体:也叫转义字符,在网页中,一些类似“大于号”和“小于号”这样的字符,无法直接使用,需要用特殊的字符串来表示. 实体语法: “&实体名字;” 或者 “&实体编号;” 注意: 最好使用 ...

  4. __x__(11)0906第三天__图片标签

    图片标签  <img src="images/1.gif" alt="冰河世纪的大松鼠" width="80%" /> Hell ...

  5. __x__(12)0906第三天__<meta>标签

    <meta name=" " content=" " />标签常用功能: 指定浏览器对当前页面的字符集: <!doctype html> ...

  6. __x__(14)0906第三天__<iframe> 内联框架 引入有一个外部html页面

    在现实开发中,不推荐使用内联框架,因为<iframe></iframe>中的内容不会被搜索引擎检索. 在特殊情况中,如内网项目,不用放在互联网上时,可以使用<iframe ...

  7. __x__(15)0906第三天__超链接

    HTML5 中的新属性. 属性 值 描述 charset char_encoding HTML5 中不支持.规定被链接文档的字符集. coords coordinates HTML5 中不支持.规定链 ...

  8. __x__(17)0906第三天__块元素block_内联元素inline_行内块元素inline-block

    1. 块元素block 独占一行的元素 一般使用块元素包含内联元素,用作页面布局 <a> 标签可以包含任何除了a标签以外的元素 <p> 标签不能包含块元素 h1... ...h ...

  9. __x__(13)0906第三天__xhtml 的语法规范

    html中不区分大小写,但是最好用小写. 注释不能嵌套. html标签必须结束,即 <></> 或者 <    /> html标签不能交叉嵌套. html的标签,有 ...

随机推荐

  1. PYTHON语言之常用内置函数

    一 写在开头本文列举了一些常用的python内置函数.完整详细的python内置函数列表请参见python文档的Built-in Functions章节. 二 python常用内置函数请注意,有关内置 ...

  2. [再寄小读者之数学篇](2014-06-23 Bernstein's inequality)

    $$\bex \supp \hat u\subset \sed{2^{j-2}\leq |\xi|\leq 2^j} \ra \cfrac{1}{C}2^{jk}\sen{f}_{L^p} \leq ...

  3. [物理学与PDEs]第2章第4节 激波 4.2 熵条件

    1.  R.H. 条件仅仅给出了越过激波时的能量守恒定律, 即热力学第一定律; 但客观的流体运动过程还需满足热力学第二定律, 即越过激波是个熵增过程: $$\bex S_1>S_0\quad(0 ...

  4. [物理学与PDEs]第1章习题2 均匀带电球面的电场强度与电势

    设有一均匀分布着电荷的半径为 $R$ 的球面, 其电荷密度 (即单位面积上的电荷量) 为 $\sigma$. 试求该球面所形成电场的电场强度及电势. 解答: 设 $P$ 距圆心的距离为 $r$, 不妨 ...

  5. 在c:forEach与s:iterator里面使用if标签判断当前位置是否为2的倍数

    在c:forEach与s:iterator里面使用if标签判断当前位置是否为2的倍数 c:forEach: <c:forEach var="workflow" items=& ...

  6. python学习之numpy.ewaxis

    当多维数组的某一列时返回的是一个行向量 >>> X = np.array([[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12]]) >> ...

  7. RDay1-Problem 1 A

    题目描述 给定一个长度为n的正整数序列a[i],计算出有多少个i<j的数对,a[i]+a[j]为二的次幂,也就是说存在一个正整数x满足a[i]+a[j]==2^x. 输入 输入文件A.in. 第 ...

  8. 小程序 -- ui布局

    Flex布局 相对定位和绝对定位 弹性盒模型 display flex-direction flex-wrap  :nowrap(不换行)/ wrap(换行,第一行在上方)/ wrap-reverse ...

  9. echart 饼状图自定义样式

    echarts.init(document.getElementById('WaterCategoryStatistics')).setOption({ legend: { orient:'verti ...

  10. Punycode

    Punycode是一个根据RFC 3492标准而制定的编码系统,主要用于把域名从地方语言所采用的Unicode编码转换成为可用于DNS系统的编码 “中文域名”不被标准的解析服务器支持,需转化为Puny ...