专门从网上收集各种有关blogger设计的文章

2007年11月14日星期三

我还可以利用 CSS 的哪些其他功能?

 

Blog 外观的各个方面几乎都可以通过模板中的样式表来进行更改。下面列出了一些最常见的项目。要查看更为深入的教程及示例,请参阅 W3 Schools CSS Examples(W3 学校 CSS 示例)和 W3C Introduction to CSS(W3C 的 CSS 简介)。

我们的默认模板中包括接近顶部的介于 <style></style> 标记之间所有 CSS 信息。您将在那里看到很多行,显示为:

模板 CSS

突出显示的行是应用于 Blog 中所有 <h3> 标记的样式。我们在这里主要为您介绍如何通过一些选项来设置样式。下面的任何一段代码都可以插入到样式表中的 { 大括号 } 内。

代码
示例

颜色

color:blue;
此文字是蓝色的。

background:yellow;
此代码将背景设置为黄色。

可以在这里插入许多常用颜色的名称(例如,red、green、yellow),要选用范围更宽广的颜色,可以使用十六进制代码(例如,#0033AA)。有关颜色的详细信息,请参阅 Web 颜色参考

边框

border:solid 1px red;

此代码将边框设置为红色。

边框既可以是实线,也可以是点线或虚线。这里指定的宽度以像素 (px) 为单位。颜色既可以是名称,也可以是十六进制代码。要设置单侧边框,请使用 border-top、border-bottom、border-right 或 border-left。

字体

font-family:"Times New Roman",Serif;
此代码将字体设置为 serif。

font-family:Verdana,Sans-Serif;
此代码将字体设置为 sans-serif。

您可以指定一个字体列表。如果读者的计算机没有第一个选项,将使用第二个,依此类推。如果在代码中指定了"serif",则使用的字体是任何一种可用 serif 字体。

font-size:24px;
此文字的高度为 24 像素。

字号的单位可以是像素 (px)、磅 (pt)、英寸 (in) 或默认字号的百分比 (%)。

font-weight:bold;
此文字是粗体。

您可以选择 bold(粗体)或 normal(常规)。

text-decoration:underline;
此文字带下划线。

文字的修饰效果可以设置为 none(无)、underline(下划线)、overline(上划线)或 line-through(删除线)。这是删除链接中的下划线最常用的方法。

text-align:right;

此文字右对齐。

对齐方式可以设置为 left(左对齐)、right(右对齐)、或 justify(两端对齐)。

外边距和内边距

margin:15px;

所有外边距均为 15px。

padding:15px;

所有内边距均为 15px。

内边距和外边距均指某个对象周围的空间。区别在于外边距指边框外侧的距离,而内边距指边框内侧的距离。(这里的边框仅仅是一个例子。)
对于边框,可以分别使用 margin-left(左外边距)、padding-top(上内边距)等一一设置与上下左右边框的距离,也可以使用 margin:1px 2px 3px 4px;(依次为上、右、下、左)一次性设置与各边框的距离。

备注:
如果要一次性设置帖子中某一段特定文字的格式,还可以使用直列式。下面是要使用的格式:
<span style="color:red;">此文字将为红色。</span>

我还可以利用 CSS 的哪些其他功能?

0 评论: