WordPress 主题风格实例教程:Style.css 和 CSS 详细介

捌零建网站 p>

大家如今早已在 style.css 文档一些內容,要我们先看来看这一部份内容是做什么的?

WordPress 主题教程:Style.css 和 CSS 介绍

第一行不言而喻便是主题风格的姓名。

第二行是这一主题风格的详细地址,假如你的主题风格仅仅私用的而禁止备公布得话,那么就无需管它了。

第三行是主题风格的叙述。

第四行是版本号号,它是十分关键的,非常是如果你公布公布你主题风格新版本本的情况下。

第五和第六行各自是主题风格创作者的姓名和首页。

在主题风格信息内容两侧的 /* 和 */ 标记是以便让主题风格的信息内容不危害该文档的别的內容,它是 CSS 的注解。当键入 CSS 编码去款式化你的网页页面的情况下,你可以能想在这里里提升些注解促使可以在之后更清晰了解这一部分编码是做什么的。显而易见大家其实不想注解危害具体的编码,因此可使用 /* 和 */ 这一对标记促使注解不被表述。

下边是解决后的主题风格信息内容

WordPress 主题教程:Style.css 和 CSS 介绍

第一步:开启 style.css 文档

开启 Xampp,主题风格文档夹,FireFox,IE 访问器和 style.css 文档。

在2个访问器的详细地址栏都键入:wordpress

从这儿刚开始,大家必须同时在 FireFox 和 IE 上检测主题风格,不一样的访问器对 CSS 的编码表述不是同的。假如可以在尽量多的访问器器上和尽量多的实际操作系统软件上检测你的主题风格是最好的(Safari,Opera,Linux,Netscape 这些)。假如你与我一样懒,那么就只在 FireFox 和 IE 上检测你的主题风格吧。

第二步:加上 CSS 编码

在 style.css 文档中键入下列编码:

body{margin: 0;font-family: Arial, Helvetica,&ia, Sans-serif;font-size: 12px;text-align: left;vertical-align: top;background: #ffffff;color: #000000;}

像 XHTML 和 PHP 一样,根据制表符提升缩近来机构编码:

WordPress 主题教程:Style.css 和 CSS 介绍

储存 style.css 文档并更新 2个访问器 Firefox 和& Explorer 查询转变。

把 body{ } 看做一个标识,随后它里边全部的物品看做特性和值,和解决 XHTML 时一样。{ 是刚开始符,} 是完毕符。在 { 和 } 中间,冒号含意是刚开始而分号含意是完毕。(我还在涉及到到 XHTML,PHP,CSS的情况下都应用标识,特性和值这种专业术语是以便维持简易,具体上 PHP 和 CSS 有不一样专业术语。如主要参数(parameters),挑选器(selector)和特性(property)。)

在大家再次以前,我必须表述下为何应用 body{ } (CSS 挑选器),是由于你是在款式化网页页面的绝大基本一部分(或是说成整体一部分), body  标识。你没会款式 head 由于这一标识沒有物品必须款式化。你网页页面上展现的绝大多数的物品是在  body  和  /body  标识中间。

随后,在后边你能款式化 ID 为 header 的 DIV 标识。

进一步的表述:

margin: 0; 解决 body 标识的默认设置的页边空白页,假如你需要页边空白页或是更大的网页页面空白页,把 0 改为 10px,20px 或是别的。PX 含意是清晰度。每一个清晰度使你电脑上显示屏的一个点。如果你的页边空白页是 0 得话,也不必须后边紧跟 px。

在下边的照片中,鲜红色高亮度的地区便是运用于 body 标识的默认设置的页边空白页:

WordPress 主题教程:Style.css 和 CSS 介绍

当给其款式化作 margin: 0;,下边是沒有页边空白页的同样网页页面:

WordPress 主题教程:Style.css 和 CSS 介绍

font-family: Arial, Helvetica, Georgia, Sans-serif; 给你的网页页面或是网站挑选应用哪样字体样式。这种字体样式中的第一个,Arial 是可更换的,假如你的客户沒有在她们的电脑上上安裝 Arial 这类字体样式,style.css 文档便会找寻 Helvetica,随后是&ia,再然后是 Sans-serif。你可以以在字体样式文档夹(我的电脑上 系统软件盘 Windows下边)寻找你的字体样式目录。

font-size: 12px; 不言而喻是字体样式尺寸。能够把它改大或改小以查询转变。

text-align: left; 给你的文字向左两端对齐。把它改为 text-align: right; 去查询不一样的地方。

vertical-align: top; 促使全部的物品从上边刚开始。假如是中间或底端排名你的 body 标识,全部物品可能往下推。

background: #ffffff; 含意是乳白色情况。#ffffff 是乳白色十六进制编码。#000000 是灰黑色十六进制编码。

color: #000000; 含意是文字色调是灰黑色。

假如你要往前更进一步或是自身学习培训 CSS,最好的地区是&


内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://wxzmzzxcx.cn/jingyan/3645.html