- 我希望大家所有的XHTML标签元素全部使用小写, 不希望大家在自己学习标签元素过程中出现任何大写字母.[MSN Spaces可能会将你辛苦写就的标签元素全部转化为大写, 这是他的病态行为, 请原谅他, 但我们自己要养成决不大写的好习惯.]
- 所有CSS属性的具体值必须用引号标起来, 任何不标引号的属性值都是不正规的. [同样的, [MSN Spaces可能会将你辛苦写就的引号全部去除, 这是他的病态行为, 请原谅他, 但我们自己要养成属性值必须添加引号的好习惯.]
- 不要害怕我到现在说了一些专有名词, 什么"HTML/CSS", "元素/属性/属性值", "标签"等等, 我不会去用一句话解释他们是什么, 因为这样的解释往往全是废话, 等于没说的废话, 我会在具体实践中告诉大家.
- 正如第一/第二条所写的那样, 我可能会莫名地要求大家遵循什么, 不推荐去做什么, 我不会解释为什么, 我只告诉大家, 那样做对你有好处, 无论你今天使用MSN Spaces还是在未来自己学做网页.
扮靓空间的最重要的要素自然是色彩的使用, 那么, 如何在MSN Spaces或者网页中对文字/页面/段落等等使用颜色呢? 字串5
字串5
Part 1: 颜色表示方法, 首先请了解颜色的表示方法:
字串4
CSS样式表颜色值表示方法 | ||
表 示 | 解 释 | 取值范围 |
red | 颜色名称/关键字表示法 | aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, yellow 还有更多 系统颜色 |
#00ffcc | #rrggbb 三个两位十六进制正整数 | 00-ff 数字越大色彩越浅 |
rgb(255,0,0) | RGB数值表示法 (Red, Green, Blue) 表示红, 绿, 蓝的正整数值 | (0-255, 0-255, 0-255) 值越大颜色越浅 |
rgb(100%,0%,0%) | RGB百分比表示法 (Red, Green, Blue) 表示红, 绿, 蓝的百分数值 | (0-100%,0-100%,0-100%) 百分数值越大颜色越浅 |
字串1
* 注释
1: 十六进制数的范围从0到F, 也就是说0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f这些数在颜色值中是合法的, 也就是#00cd12是正确的, #1298gc 就是错误的, 因为'g' 超出了范围.
2. 3个两位十六进制数均为同样的值, 则可以省略一个, 例如: #ccdd33可省略写为#cd3; 但是#ccde23则不能省略为#cde23, 这是完全错误的.
3. rgb表示法中超出了限制则自动取边值, 例如: rgb(10, -10, 280) 自动按 rgb(10, 0, 255); rgb(120%, 10%, 30%) 自动按 rgb(100%, 10%, 30%) 取值.
4. 四种表示法中除了第一种表示的颜色数目相对较少外, 其他可以基本做到表示法的完全互换, 例如:
black = #000000 = rgb(0, 0, 0) = rgb(0%, 0%, 0%)
red = #ff0000 = rgb(255, 0, 0) = rgb(100%, 0%, 0%)
5. 如何获得这些颜色的rgb值或者十六进值? 当然你们也可以搜索到更好的.
http://www.codedefect.com/spaces/ColorPicker.aspx
字串7
以名字/关键字显示的一些颜色以及其相应16进/RGB值 | ||
silver #c0c0c0 rgb(192,192,192) | gray #808080 rgb(128,128,128) | aliceblue #f0f8ff rgb(240,248,255) |
aqua #00ffff rgb(0,255,255) | teal #008080 rgb(0,128,128) | black #000000 rgb(0,0,0) |
green #008000 字串6 rgb(0,128,0) | navy #000080 rgb(0,0,128) | blue #0000ff rgb(0,0,255) |
fuchsia #ff00ff rgb(255,0,255) | white #ffffff rgb(255,255,255) | lime #00ff00 rgb(0,255,255) |
| yellow #ffff00 rgb(255,255,0) | olive #808000 rgb(128,128,0) | purple #800080 rgb(128,0,128) |
maroon #800000 字串3 rgb(128,0,0) | red #ff0000 rgb(255,0,0) | orange #ffa500 rgb(255,165,0) |
Part 2: 经常用到颜色值的样式属性
当我们了解了颜色值的表示方法后, 我们需要一些需要颜色值的样式表属性. 这些属性包括我们最常用到的字体颜色, 背景颜色, 边框颜色等等,
字串2
CSS样式表最常用的需要颜色的属性 | ||
属 性 | 解 释 | 具体表示 |
color | 文本颜色 | color:#ff0000 color:blue |
background-color | 背景颜色 | background-color:rgb(240,10,10) |
border-color | 边框颜色 | border-color:black |
字串3
* 注释: 其他还有很多属性需要用到颜色值, 例如: scrollbar-face-color[滚动条3D表面的颜色], outline-color[线条轮廓的颜色]等等, 由于滚动条属性只是Internet Explorer的专有属性, 非CSS标准属性, 就不多作介绍了, 以后课程会专门用一节课做滚动条样式的使用.
Part 3: 具体应用
当我们了解了颜色取值后, 我们来具体应用他.
在MSN Spaces表示时元素需要使用style[因为我们不能通过其他途径调用CSS样式表]:
style = "color:#f0c; background:rgb(245,230,245)"
字串9
一般来说, 我们经常要用到
div(division)是一个块级元素, 可以包含段落, 标题, 表格等, 而span是行内元素, span的前后不换行, 它没有结构的意义, 纯粹是应用样式, 当其他行内元素都不合适时, 可以使用span. 字串3
字串2
字串6
我要换行了 呵呵
这是span来表示的文字
我也要换行了 呵呵 字串8
仅仅从背景色大家就可以看出使用
字串7
字串4
你好啊?
Belem强烈建议大家以后在表示文字颜色的时候使用
下面是其他的一些表现手法:
字串7
style="color: #8e604f">Easy Start To The Day Belem's Space |
----
本节课我们用到的HTML/XHTML元素 | |||||
HTML 4.01[共享空间适用] | XHTML 1.1 | XHTML 2.0 | |||
元素 | 功能 | 元素 | 功能 | 元素 | 功能 |
Block-level | Text Module | Structural Module | |||
Inline | Text Module | Text Module | |||
Reference URL
| Reference URL
| Reference URL | |||
本节课我们用到的CSS属性及属性值 | |||
CSS 2.1 | |||
属性 | 功能 [值/单位] | 属性 | 功能 [值/单位] |
color:#0fc | 文本颜色 | background-color:#0fc | 背景颜色 |
height:16px | 高度 [像素] | width:120px | 宽度 [像素] |
font-weight:bold | 粗体 | text-align:center | 文字对齐[居中] |
border-color:#0fc | 边框颜色 | ||
Reference URL
| |||
----
