-
div+css视频教程之为你的世界添加色彩
欢迎进入第4天的课程。在此之前我们主要谈了文字样式设定,现在我们探讨一下要素和图象方面的样式设置。通过学习今天的课程,我们将掌握如何给要素赋予色彩,将图象放在要素后面。如果以前你一直不认为CSS是一种很有用的东西,那么今天将是你大彻大悟的一天。
我们将学习以下CSS属性:
颜色
背景色
背景图象
重复背景
固定背景
背景定位
背景
颜色
颜色属性并不陌生,它的用法很象HTML中使 用的参数值。
B { color: #333399 }
根据这项CSS规则,浏览器将网页上所有的加 重体字以设定的颜色显示,象这几个字那样。
如果你的浏览器不支持这项CSS属性,请点击 这里查看英文原版的显示效果。
有3种方法用于设定你所需要的颜色:
颜色名称
CSS所用的颜色名称同我们常用的称呼 方式。16种基本色为aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.
但是Netscape和Microsoft的浏览器还 认可数百种其它色彩名称,参见 HYPE's Color Specifier.
16进制(hex)色彩控制
使用16进制数可实现对色彩的更精确 的控制,其格式为 #336699。16进制 (hex)色彩控制详见 Webreference.com。
CSS还支持某些hex值的快捷计数法。 比如, #336699可以被称为 #369。 浏览器会将其按照16进制格式阐释。
RGB值
对于习惯于RGB计数法的用户,这里 将提供一种全新的色彩设定方法。 RGB法通常用于图象应用软件例如 Photoshop。利用RGB设定色彩的方法 如下:
B { color: rgb(51,204,0) } RGB的数值范围从0到255,R代表红色, G代表绿色,B代表蓝色。
我们将学习以下CSS属性:
颜色
背景色
背景图象
重复背景
固定背景
背景定位
背景
为你的世界添加色彩
首先,我们谈一下将颜色加到网页要素上。颜色
颜色属性并不陌生,它的用法很象HTML中使 用的参数值。
B { color: #333399 }
根据这项CSS规则,浏览器将网页上所有的加 重体字以设定的颜色显示,象这几个字那样。
如果你的浏览器不支持这项CSS属性,请点击 这里查看英文原版的显示效果。
有3种方法用于设定你所需要的颜色:
颜色名称
CSS所用的颜色名称同我们常用的称呼 方式。16种基本色为aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, and yellow.
但是Netscape和Microsoft的浏览器还 认可数百种其它色彩名称,参见 HYPE's Color Specifier.
16进制(hex)色彩控制
使用16进制数可实现对色彩的更精确 的控制,其格式为 #336699。16进制 (hex)色彩控制详见 Webreference.com。
CSS还支持某些hex值的快捷计数法。 比如, #336699可以被称为 #369。 浏览器会将其按照16进制格式阐释。
RGB值
对于习惯于RGB计数法的用户,这里 将提供一种全新的色彩设定方法。 RGB法通常用于图象应用软件例如 Photoshop。利用RGB设定色彩的方法 如下:
B { color: rgb(51,204,0) } RGB的数值范围从0到255,R代表红色, G代表绿色,B代表蓝色。
栏目列表
最新更新
nodejs爬虫
Python正则表达式完全指南
爬取豆瓣Top250图书数据
shp 地图文件批量添加字段
爬虫小试牛刀(爬取学校通知公告)
【python基础】函数-初识函数
【python基础】函数-返回值
HTTP请求:requests模块基础使用必知必会
Python初学者友好丨详解参数传递类型
如何有效管理爬虫流量?
SQL SERVER中递归
2个场景实例讲解GaussDB(DWS)基表统计信息估
常用的 SQL Server 关键字及其含义
动手分析SQL Server中的事务中使用的锁
openGauss内核分析:SQL by pass & 经典执行
一招教你如何高效批量导入与更新数据
天天写SQL,这些神奇的特性你知道吗?
openGauss内核分析:执行计划生成
[IM002]Navicat ODBC驱动器管理器 未发现数据
初入Sql Server 之 存储过程的简单使用
这是目前我见过最好的跨域解决方案!
减少回流与重绘
减少回流与重绘
如何使用KrpanoToolJS在浏览器切图
performance.now() 与 Date.now() 对比
一款纯 JS 实现的轻量化图片编辑器
关于开发 VS Code 插件遇到的 workbench.scm.
前端设计模式——观察者模式
前端设计模式——中介者模式
创建型-原型模式