在HTML文件中设置样式表

  • 级联样式表(Cascading Style Sheet,CSS)旨在将web页面的样式与内容进行分离。

  • 选择器就是不带尖括号的HTML标记。CSS属性用来定义选择器的特定特性。

  • 当为属性指定属性值时,就是为选择器创建一个声明。(在一个CSS属性名之后使用一个冒号,后跟该属性的值,属性值无须使用引号括起【对于用长度或百分比作为单位的值,通过在值之前添加一个正号或负号,可以使之取值为正或负】,属性值之后是一个分号)可将声明和选择器合称为一个规则集合,在典型规则集中,将声明放在一对花括号中,位于选择器之后。

(百分比允许元素根据屏幕的大小和窗口的尺寸进行调整和移动,用于指出它与包含它的父元素之间的关系)

**
**

创建样式的优先级:内联(直接嵌入到它所影响的HTML代码中)>内部(放在web页面的<head>信息中)>外部(外部样式的代码放在一个独立的文档中,从实际使用该样式表的web页面的<head>标记中引用该样式,使用单个外部样式表可定义多个web页面的呈现效果)

【当在一个标记中添加内联样式表时,它仅影响单个标记,不影响到页面中所有类似的元素,若想改变一个页面中所有类似元素的样式,用<style>元素自身来包含该页面所有的样式指令。在外部样式表中无须使用<style>元素或style特性,在创建外部样式表后,使用.css作为文件扩展名,将其另存为一个文本文件。】

  • 【为了声明一个样式更加重要,只需在样式声明之后添加important关键字,为了让浏览器能正确的分析,必须将important关键字放在一个叹号之后。】

**
**

Web开发中引用颜色的方法:

  • 计算机的显示器以RGB模式来显示颜色**,R代表红色,G代表绿色,B代表蓝色。R,G,B用一个介于0~255之间的值来表示,在色谱中,0代表最暗,255代表最亮。
  • 在HTML页面中使用十六进制颜色值时,需要将颜色值从十进制(RGB)转化为十六进制。将红,绿,蓝色值分别转化为一个两位的十六进制值。然后将这三个十六进制值合并在一起作为单个字符串,并在开头加上一个井号(#)。当引用的颜色具有成对的值时,可以使用简写方式以减少所需输入字符的数量。/Eg:十六进制值003366的一个颜色值简写为036./
  • RGB值和百分比:颜色值容易得到用RGB值,eg:<p style=”color:
    rgb(0,0,,255);”>

没有方便的RGB值,可使用RGB值的百分比。<p style=”color: rgb(0%,0%,100%);”>

在每一个R,G,B值之间请使用一个逗号进行分隔,将整组值放在一对圆括号之中。在圆括号之前是小写的rgb三个字符,RGB值和百分比只能在样式表中描述颜色。

  • HTML5/CSS3中更新,对颜色透明度的支持。采用RGBA方法可以指定颜色的alpha值。Eg:
    h1 {color: rgba(255,68,253,0.5);}
  • opacity的取值范围为0.0(完全透明)~1.0(完全不透明)
    eg:div.transparentbox
    {background-color:#036; opacity:0.7;}

[color属性用于指定文本的前景色,background-color属性用于确定背景色]

body {background-image: url(images/background.jpg);}//是通过URL引用背景图片images/background.jpg

当想改变页面链接的颜色时,应该使用a元素作为CSS选择器。(a标记和href特性用于链接到其他网址。)

当想改变页面背景颜色时,应该使用body元素作为CSS选择器。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,504评论 6 496
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,434评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,089评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,378评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,472评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,506评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,519评论 3 413
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,292评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,738评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,022评论 2 329
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,194评论 1 342
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,873评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,536评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,162评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,413评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,075评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,080评论 2 352

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,747评论 1 92
  • FreeCodeCamp - HTML5 and CSS 发现原来在另外一台电脑学 FreeCodeCamp 的时...
    付林恒阅读 9,360评论 2 17
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    程序员poetry阅读 16,530评论 32 459
  • «蓬莱» 海风吹拂山外天,碧浪散雪岸边现。 身临蓬莱知仙境,才信此处住神仙。
    金紫缘阅读 223评论 0 6
  • 艾斯在白船地位大约相当于三灾和三将星,在杰克和饼干登场前,艾斯5.5E是已知最高赏金,但杰克10E和饼干8.6E赏...
    小李talk阅读 944评论 0 1