Wikibooks
zhwikibooks
https://zh.wikibooks.org/wiki/Wikibooks:%E9%A6%96%E9%A1%B5
MediaWiki 1.39.0-wmf.25
first-letter
Media
Special
Talk
User
User talk
Wikibooks
Wikibooks talk
File
File talk
MediaWiki
MediaWiki talk
Template
Template talk
Help
Help talk
Category
Category talk
Transwiki
Transwiki talk
Wikijunior
Wikijunior talk
Subject
Subject talk
TimedText
TimedText talk
Module
Module talk
Gadget
Gadget talk
Gadget definition
Gadget definition talk
CSS
0
9938
168510
168504
2022-08-17T12:38:14Z
Paho.mqtt
60409
/* 規則(Rules) */
wikitext
text/x-wiki
{{split}}
{{noteTA
|1 = zh-cn:块状元素; zh-tw:區塊標籤;
|2 = zh-cn:内联元素; zh-tw:同軸標籤;
}}
{{ambox|text=本页面存在草稿子页面[[CSS/草稿]]。}}
==狀態==
備忘錄：正在寫書本的大綱階段。
==本書的內容==
這本書唯一的主題就是 [[Wikipedia:CSS|CSS]]，因此，這本書不會告訴你 CSS 的歷史，也不會著墨於 CSS 的好處與優點，因為在網路上已經有很豐富的資料。然而我鼓勵讀者若是時間許可，應該花些時間了解為什麼網頁技術怎麼從 [[Wikipedia:HTML|HTML]] 開始，後來衍生出 CSS，而最後又冒出 [[Wikipedia:XHTML|XHTML]] 。關於 CSS 的歷史，你可參考 [http://virtuelvis.com/archives/2005/01/css-history Who created CSS? CSS Early History]，至於 CSS 的好處與優點，用了你就會了解。
雖然我會在適當的地方加入參考資料或是連結，但是基本上，沒有閱讀這些參考資料與連結並不會影響你學習 CSS。因此，除了自己動手作停下來之外，盡量別讓其他的事情中斷你的閱讀。
CSS 3 增加了对圆角<ref name="莫振杰_进阶_p172">见莫振杰《HTML与CSS进阶教程》第172页(位于第11章“CSS图形”第3节“圆”)。</ref>、阴影的直接支持，有助于简化开发。在以前要完成基本的边框圆角效果非常麻烦，需要自己提前制作好图片，无法仅借助CSS直接实现<ref name="莫振杰_进阶_p172" />。
==先統一辭彙==
Cascading Style Sheet (CSS) 的中文翻譯一直沒有定調，有人稱他為「层叠样式表」，也有稱「串接樣式表」，我想，我在這裡不為 CSS 的中文譯名正名，往後的文章中，中文一律用「樣式表」來稱呼 CSS，不過我寧可多用英文，以免造成誤解。
還有一個重要的詞彙「selector」，中文有「選擇器」與「選取項」兩種翻譯，本書我採用後者。
==前言：一個網頁的構成==
底下的說明，對於任何數位的文件來說，都會成立，但是我仍然將數位文件侷限在網頁這個範圍，這樣會讓問題單純一些。
從產生（或是製作）的過程來看，網頁可以區分為：
#內容（contents）
#呈現（presentation）
兩大元素。簡單的說，我們會依照不同的重要性、不同的性質（屬性）與意圖，將網頁的內容結構化，之後，再依據這個架構，給予各個部份合適的呈現方式。這就是我們最後看到的網頁。
=== 概述 ===
===不同性質的內容===
我們先試著從不同的角度來看一分網頁，先從瀏覽器呈現出來的畫面，再到原始碼，最後看看有沒有什麼遺漏的內容。
====從瀏覽器看到的成品====
大家可以回想一下你曾經看過或是作過的網頁，從瀏覽器前端看得到的組成元素不外乎底下的幾個要素：
;標題（heading）
:網頁的第一級標題、第二級標題、第三級 ... 標題。
;段落（paragraph）
:指的是一段意義完整的圖、文。
;表格（table）
:例如價目表、行事曆等等，由行、列組成的資料。
;清單（list）
:有序的清單、無序清單與定義式清單。
;圖片（image）
:各種可以被瀏覽器讀取的格式的圖檔。
;超連結（hyperlink）
:超連結是網頁有別於一般文件的一個很重大的分野，因此，我也把它當作是網頁的一個要素。
;表單（form）
:有按鈕、單選選項（raido）、複選選項（check box）、輸入欄位（text field）、輸入文字區塊（text area）等等。
;多媒體（multimedia）
:影片、音樂或是 flash。
====反觀網頁原始碼====
若是你熟悉原始碼，上面我提到的每一個要素，你一定可以立刻對應到某個 HTML 的標籤（tag），但是在原始碼裡面，你會發現更多東西，例如：
*Javascript
*meta 標籤
*style 標籤
*...
事實上，在原始碼裡面，我們還要提供許多很關鍵的資訊給瀏覽器或是搜尋引擎，這些資訊並不會呈現在使用者眼前，但是卻與網頁的呈現正確與否息息相關。這些資訊包括：
利用 meta 標籤告訴瀏覽器你的網頁所使用的編碼，例如：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
====其他====
若是你細心一點，你一定會發現，一個網頁所包含的元素裡面，我們漏提了許多的東西，例如：
;關於整個版面的
*前景、背景顏色
*邊界
*間距
;關於字體的
*字型、字級與顏色
*行高
===HTML 與 CSS 的分工===
談到這裡，我想你一定感覺到了，原來所謂的「標記語言（markup language）」確實是要替文件的內容加上註記，讓一個文件的結構清晰、層次分明。熟悉 HTML 的人會說，HTML 的標籤裡面還是有一些用來作格式化（也就是定義呈現方式）的標籤，如：<b>、<i>，但是，總體來說，HTML 最大的用途乃是用來描述文件的架構，讓文件本身在結構上具有意義，甚至更進一步的讓文件具有語義。
至於樣式表的角色呢？它是用來告訴瀏覽器，如何裝扮每一個 HTML 標籤所標示的內容。所以，任何談到樣式表與 HTML 的文章都會說：「藉由 CSS，我們讓文件的內容與呈現可以分離。」沒錯，這就是學習 CSS 的目的，你應該開始想像，在不更動任何 HTML 原始碼的狀況下，藉由修改樣式表，你的網頁將呈現各種風格迥異的面貌。
==HTML 簡單介紹（A Brief of HTML）==
在真正提到 CSS 之前，弄清楚下列幾個 HTML 的基本觀念，可以讓你更快掌握 CSS，也可以幫助你將來比較容易閱讀其他相關文件，另外，用合適的術語表達概念，有助於與其他設計師的溝通。
===標籤與元素 (Tags and Elements)===
[[Image:tag-n-element.png|thumb|標籤與元素]]
;標籤（tag）
*介於左右三角括弧 (angled brackets) 的文字，如：<body>
*通常標籤是成對的，分別成為「起始標籤（opening tag）」與「結束標籤（closing tag）」，我們將內容在兩個標籤之中。
*一般而言，標籤用來告訴瀏覽器採取什麼處理方式：起始標籤告訴瀏覽器開始某個處理方式，結束標籤告訴瀏覽器終止該處理方式。
;元素 (elements)
*由起始標籤、結束標籤和其間的內容所構成，例如：'''<nowiki><b>This is bold text</b></nowiki>'''
===屬性 (Attribute)===
我們以實際的例子來說明：
<pre>
<img src="images/foo.gif" alt="範例" width="100" height="50" />
</pre>
這是一個 img 標籤，在原始碼中，標示這裡要放入一張圖，圖片來源（source, src）是 image/foo.gif 這個檔案，萬一圖片無法顯示時，替代的（alternative, alt）文字是 "範例"，而這張圖的寬度（width）是 100 像素（pixels），高度（height）是 50 像素。
我們稱呼：
*src
*alt
*width
*height
為 img 標籤的屬性，而等號（=）後面用雙引號括起來的稱為屬性的「值（value）」。
不同的標籤有不同的屬性，數量也不一樣。
===區塊標籤（Block-level Tags）與同軸標籤（Inline Tags）===
我們先看一個例子，再來解釋什麼是 block-level 什麼是 inline。
{|border="1" width="90%" cellpadding="5"
!width="50%"|HTML 原始碼
!width="50%"|呈現
|-
|
<pre>
<p>
這是用來說明
<b>區塊標籤（block-level tags）</b>與
<b>同軸標籤（inline tags）</b>的例子。
</p>
<p>
你注意到例子中，兩個標籤一個會造成換行，一個卻沒有
</p>
</pre>
|
<p>這是用來說明'''區塊標籤（block-level tags）'''與'''同軸標籤（inline tags）'''的例子。</p>
<p>你注意到例子中，兩個標籤一個會造成換行，一個卻沒有</p>
|}
在上面的例子當中，<nowiki><p></nowiki> 標籤所形成的元素，會自成一個區塊（也就是會換行），<nowiki><b></nowiki> 標籤所形成的元素，並不會這樣，它僅在同一行裡作用。在 HTML 裡面，常看到的 block-level 的標籤有：
*blockquote - 引用的區塊
*center - 區塊置中
*div - 通用的 block-level 標籤
*h1 - 第一級標題
*h2 - 第二級標題
*h3 - 第三級標題
*h4 - 第四級標題
*h5 - 第五級標題
*h6 - 第六級標題
*hr - 水平線
*p - 段落
*pre - 保留文字格式
而 inline 的標籤有：
*a - 錨點（超連結標籤）
*br - 段行
*iframe - 同軸框架（Inline frame）
*img - 圖片
*q - 簡短的引用
*script - 用戶端 script
*span - 通用的 inline 標籤
*sub - 下標（subscript）
*sup - 上標（superscript）
==格式化表單的位置(Where to place Style Sheet?)==
{{main|CSS/Applying CSS to HTML and XHTML|l1=把CSS应用到HTML}}
===內部格式化表單(Internal Style Sheet)===
又稱內嵌式格式化表單（Embedded style sheet）
例如：
<syntaxhighlight lang="html5">
<style type="text/css">
/*CSS goes here...*/
</style>
</syntaxhighlight>
其中 <code>style</code> 标签内为放置 CSS 代码的地方。
===外部格式化表單(External Style Sheet)===
CSS 内可用 <code>@import</code> 语句，在一个 CSS 内引入其它 CSS：
<syntaxhighlight lang="css">
@import url("mystyle.css");
</syntaxhighlight>
在html文件中，引入样式表的方法可用 <code>link</code> 标签，如下所示。
<syntaxhighlight lang="html5">
<link rel="stylesheet" href="mystyle.css" type="text/css" />
</syntaxhighlight>
外部样式表的好处是令结构和表现完全分离。
===内联样式表 (Inline Style Sheet)===
如下所示是一个使用内联样式表的示例。通过 <code>style</code> '''属性'''，可以为元素添加样式。它无法做到结构与表现的分离，但在无法引入外部样式表或 <code>style</code> '''标签'''时（如[[维基百科]]）时仍然有用。
<syntaxhighlight lang="html5">
<div style="color:red; background:yellow; font-weight:bold;">
這個段落會被顯示為黃底紅字粗體。
</div>
</syntaxhighlight>
显示为
<div style="color:red; background:yellow; font-weight:bold;">
這個段落會被顯示為黃底紅字粗體。
</div>
==CSS结构==
===语法===
{{main|CSS/Syntax|l1=语法}}
<syntaxhighlight lang="css">
@rule argument(s) {
selector {
property: argument(s);
another-property: argument(s);
property-the-third: argument(s);
fourth-property: argument(s);
}
}
</syntaxhighlight>
===規則(Rules)===
{{main|CSS/Rules|l1=定义样式规则}}
===长度和单位===
{{main|CSS/Lengths and Units|l1=长度和单位}}
=== 選取項(Selector) ===
{{main|CSS/选择器}}
===繼承的問題(Inheritance)===
{{main|Inheritance Rules|l1=继承规则}}
===关键字Important===
{{main|CSS/Important}}
===註解符號 (Commenting)===
<syntaxhighlight lang="css">
/* comment contents */
</syntaxhighlight>
===樣式的優先順序(Priority rules)===
CSS不同定义方式的样式，其优先级为：内联指定的style > 通过id指定的style > 通过class指定的style > 通过html tag指定的style
故得名Cascading
== 瀏覽器如何工作？( How browsers work?) ==
== 方框的基本介紹 (Introduce to Box) ==
在CSS中，瀏覽器將每個標籤用Box方式呈現，並分為行內Box以及區塊Box。
每個Box區塊使用Box模式（Box model）呈現，以外距、邊線、內距、內容四種屬性（由外而內）的順序組成一個Box。
== 幾個特別的性質(properties) ==
== 注意 ==
有時一個網頁的作者會濫用CSS。有些習慣於只使用HTML的作者可能會忽視CSS提供的可能性。比如有些習慣於使用HTML的顯示元素的作者可能會在所有的HTML文件內加入CSS樣式。這比將HTML顯示和結構指令混在一起是一個進步，但它還是有許多同樣的缺點，而且維護時的工作量與混合使用差不多。
CSS與其他程式語言有著一些共同的陷阱。尤其在命名CSS的id和class時，CSS作者常選擇一個比較有說明性的名稱而使用顯示特徵作為它們的名稱。比如一個作者可能使用「big-red」來命名一個用大紅字體的突出顯示的字節。在當時，對作者來說這個名稱可能是很直覺的，但假如後來作者決定突出顯示的字節應該使用綠色，而不是紅色的話，他的命名就有毛病了。在上面這個例子中，一個更合適的名稱應該是「emphasized」（強調），它描寫的是這個「class」的用意，而不是它是如何被顯示的。
另一個毛病是未記錄的、未定義的和往往會被遺忘的名稱。一個網頁作者可能會選擇上百個名稱。名稱如footer、footnote或者explanation、note、info、more可能是指同一回事。這樣許多重複的名稱就出現了。有時一個複雜的網站的設計者可能會結合HTML和CSS來解決這個問題，但這樣一來他又把內容與顯示黏有一起了，而且這樣一來這個文件就只適合於某一媒體了。（外部樣式表的一個大優點就是它是跨媒體的，因為不同的樣式可以特別適用於不同的輸出媒體。）
HTML本身的複雜性是另一個困難處。雖然大部分使用CSS的文件比傳統的使用表格的文件要整潔，但過分使用class和過於細膩的結構層次同樣使HTML變得繁庸。此外有的作者過分使用div元素。
另一個陷阱是為了解決常見的瀏覽器錯誤而引入特別的CSS樣式，這些樣式當然是為了除錯而引入的，但它們使一個CSS文件的維護性能降低，有時這樣的CSS文件的維護量甚至比過去的HTML文件的維護量還大。常見的特別CSS樣式多是針對Internet Explorer（尤其IE 6、IE 7等舊版本）的顯示錯誤而額外編寫。
有時一個作者可能會過度地使用CSS來決定他的文件應該怎樣被顯示，如：一個作者會決定隱藏超連結底下的橫線，這很容易做到，但對瀏覽者來說這可能會帶來不便。
有些新的CSS3樣式尚未成為標準，因此在使用時需要加上前綴（Prefix），使其可以在採用不同排版引擎的瀏覽器中正確顯示。但于[[Internet Explorer 10]] Release Preview起, transform, transition, [[CSS Animations|animation]]和gradient渐变等属性均可不加前缀。<ref>[http://blogs.msdn.com/b/ie/archive/2012/06/25/unprefixed-css3-gradients-in-ie10.aspx Unprefixed CSS3 Gradients in IE10]</ref><ref>[http://blogs.msdn.com/b/ie/archive/2012/06/06/moving-the-stable-web-forward-in-ie10-release-preview.aspx Moving the Stable Web Forward in IE10 Release Preview]</ref>例如使用transition時，需要額外撰寫四行編碼：
<syntaxhighlight lang="css" style="overflow-x:auto">
-webkit-transition: height 0.2s linear; /* 針對使用WebKit排版引擎的瀏覽器，如Google Chrome、Apple Safari */
-moz-transition: height 0.2s linear; /* 針對使用Gecko排版引擎的瀏覽器，如Mozilla Firefox */
-o-transition: height 0.2s linear; /* 針對使用Presto排版引擎的瀏覽器，如Opera */
-ms-transition: height 0.2s linear; /* MSIE，但Release Preview起可以不用前缀*/
transition: height 0.2s linear; /* CSS3標準，放最後*/
</syntaxhighlight>
CSS的大小因此增大，到這些CSS樣式不需前綴時，又需要額外花時間把它們刪除。
== 參考資料 ==
=== 文内引用 ===
<references/>
=== 补充来源 ===
* {{cite book |title=HTML与CSS进阶教程 |author=莫振杰 |publisher=人民邮电出版社 |location=中国北京 |edition=1 |series= |ISBN=978-7-115-43295-7 |language=zh-cn |year=2016年}}
=== 其它资料 ===
* Cascading Style Sheets, Level 2
* Code Style Media monitor
* CSS - Cascading Style Sheets
* CSS Bugs and Workarounds
* CSS Panic Guide
* CSS Reference Table
* css-bug info
* glish.com CSS layout techniques
* glish.com
* Guide to Cascading Style Sheets
* Little Boxes
* Pixellated! DesignDevelopDeliver
* RichInStyle.com - Style sheet master class part 1 - writing perfect style sheets
* Tableless layout HOWTO
* The Layout Reservoir - BlueRobot
* Web Nouveau Table-less sites list-1
* Webmonkey Reference Stylesheets Guide
* Working with CSS - Introduction to CSS Layout
{{Wikipedia}}
{{DEFAULTSORT:Cascading Style Sheets}}
[[Category:电脑]]
{{bookCat}}
jhub09s6ntdq2bq9a9z10samkize6nr
初中數學/算則練習/小數四則
0
19668
168513
137640
2022-08-18T06:20:22Z
2001:B400:E45E:D77C:9C78:3AFF:FE3D:3D72
wikitext
text/x-wiki
[[分類:數學]]
# 31.11+5=
# 3.8+0.15 =
# 7.1+7.91 =
# 0.9-0.08 =
# 25.25+11.11=
# 7.91-0.88 =
# 31.36+5-5.05=
# 36÷5=
# 0.8÷0.2 =
# 0.12÷0.4 =
# 1.44×25+11=
# 0.66×0.11=
# 0.5x+12.2x=
# 0.32*0.6=
# 2.4y+3.6（10.101x+10.01z)-11.1105x-11.011z=
95xqsd5o6hhvx03jxhhdpzfsnnmlott
CSS/Syntax
0
31994
168509
166763
2022-08-17T12:33:24Z
Paho.mqtt
60409
wikitext
text/x-wiki
<noinclude>
{{TOCright}}
</noinclude>
CSS最常是链接到网页，因此可用于整个网站。由于是单独文件，有它自己的结构。
样式表的开头是个声明。
<syntaxhighlight lang="css"> @charset "UTF-8";</syntaxhighlight>
上述声明之后，每条CSS规则是独立的，包括3部分：选取项、属性、实参（即值）：
'''Example:'''
<syntaxhighlight lang="css">
@charset "UTF-8";
body {
background-color : #000000;
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 100%;
color : #ffffff;
margin : 0;
padding : 0;
text-align : center;
}
h1 {
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 16px;
color : #ffffff;
font-style : normal;
font-weight : normal;
letter-spacing : 0.1em;
}
h2 {
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 12px;
font-style : italic;
font-weight : bold;
color : #ffffff;
text-decoration : underline;
}
p {
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 12px;
font-style : normal;
color : #ffffff;
}
etc
</syntaxhighlight>
规则可分解如下：
<syntaxhighlight lang="css">
@rule argument(s) {
selector {
property: argument(s);
another-property: argument(s);
property-the-third: argument(s);
fourth-property: argument(s);
}
}
</syntaxhighlight>
每个选取项可以有任意多的属性-值对。
==At规则==
CSS 的顶层样式表由两种规则组成的规则列表构成，一种被称为 at-rule，也就是 '''at规则'''，另一种是 qualified rule，也就是'''普通规则'''。
at 规则由一个@关键字和后续的一对花括号的区块组成；如果没有区块，则以分号结束。
===@charset===
用于提示 CSS 文件使用的字符编码方式，它如果被使用，必须出现在最前面。这个规则只在给出语法解析阶段前使用，并不影响页面上的展示效果。
<syntaxhighlight lang="css">
@charset "utf-8";
</syntaxhighlight>
===@import===
<syntaxhighlight lang="css">
@import "index.css";
@import url("index.css");
</syntaxhighlight>
import 还支持 supports 和 media query 形式。
<syntaxhighlight lang="css">
@import [ <url> | <string> ]
[ supports( [ <supports-condition> | <declaration> ] ) ]?
<media-query-list>? ;
</syntaxhighlight>
===@media===
media 是 media query 使用的规则，能够对设备的类型进行一些判断
<syntaxhighlight lang="css">
@media print {
body { font-size: 10px }
}
</syntaxhighlight>
===@page===
page 用于分页媒体访问网页时的表现设置
<syntaxhighlight lang="css">
@page {
margin: 10%;
@top-left {
content: "Hamlet";
}
@top-right {
content: "Page " counter(page);
}
}
</syntaxhighlight>
===counter-style===
counter-style 产生一种数据，用于定义列表项的表现。
<syntaxhighlight lang="css">
@counter-style triangle {
system: cyclic;
symbols: ‣;
suffix: " ";
}
</syntaxhighlight>
===@key-frames===
keyframes 产生一种数据，用于定义动画关键帧。
<syntaxhighlight lang="css">
@keyframes diagonal-slide {
from {
left: 0;
top: 0;
}
to {
left: 100px;
top: 100px;
}
}
</syntaxhighlight>
===@fontface===
fontface 用于定义一种字体，icon font 技术就是利用这个特性来实现的。
<syntaxhighlight lang="css">
@font-face {
font-family: Gentium;
src: url(http://example.com/fonts/Gentium.woff);
}
</syntaxhighlight>
===@support===
support 检查环境的特性，它与 media 比较类似。
===@namespace===
用于跟 XML 命名空间配合的一个规则，表示内部的 CSS 选择器全都带上特定命名空间。
===@viewport===
用于设置视口的一些特性，不过兼容性目前不是很好，多数时候被 html 的 meta 代替。
===其他不太推荐的at规则===
@color-profile、@document、@font-feature-values
==块==
CSS中的块（block）包括一条或多条语句（或者叫做声明）。块以<code>{</code>开始，以<code>}</code>结束.
==属性==
属性（property)是CSS的真正内容所在。语法相当简单： <code>property: argument(s);</code>. 属性必须出现在一个选择器后面的<code>{}</code>中，必须以分号<code>;</code>结束.
{{BookCat}}
bk2md66t6es2f94rjyx3lkidn4p7jag
Wikibooks:GUS2Wiki
4
32222
168507
168442
2022-08-17T12:19:50Z
Alexis Jazz
55150
Updating gadget usage statistics from [[Special:GadgetUsage]] ([[phab:T121049]])
wikitext
text/x-wiki
{{#ifexist:Project:GUS2Wiki/top|{{/top}}|This page provides a historical record of [[Special:GadgetUsage]] through its page history. To get the data in CSV format, see wikitext. To customize this message or add categories, create [[/top]].}}
以下是缓存的数据，最后更新于2022-08-14T14:46:35Z。缓存中最多有{{PLURAL:5000|5000条结果}}。
{| class="sortable wikitable"
! 小工具 !! data-sort-type="number" | 用户人数 !! data-sort-type="number" | 活跃用户
|-
|AdvancedSiteNotices || data-sort-value="Infinity" | 默认 || data-sort-value="Infinity" | 默认
|-
|Blackskin || 15 || 0
|-
|Cat-a-lot || 32 || 2
|-
|CleanDeleteReasons || data-sort-value="Infinity" | 默认 || data-sort-value="Infinity" | 默认
|-
|Edittools-VFD || 54 || 2
|-
|Edittools-ZHC || 72 || 2
|-
|Edittools-admin || 31 || 0
|-
|Edittools-cite || 78 || 2
|-
|Edittools-default || 60 || 1
|-
|Edittools-plus || 123 || 2
|-
|Edittools-user || 41 || 0
|-
|HotCat || 105 || 3
|-
|JSL || 88 || 2
|-
|Navigation popups || 89 || 3
|-
|PreviewWithVariant || 23 || 1
|-
|UTCLiveClock || 91 || 2
|-
|blinktalk || 34 || 0
|-
|contribsrange || 52 || 2
|-
|easy-archive || 10 || 1
|-
|edit0 || 87 || 2
|-
|hantsect || 51 || 0
|-
|internalLinkHelper-altcolor || data-sort-value="Infinity" | 默认 || data-sort-value="Infinity" | 默认
|-
|internalLinkHelper-cravix || 2 || 0
|-
|internalLinkHelper-external || 1 || 0
|-
|internalLinkHelper-ilbluehl || 3 || 0
|-
|internalLinkHelper-redonly || 1 || 0
|-
|internalLinkHelper-redplain || 2 || 0
|-
|internalLinkHelper-redtipsy || 3 || 1
|-
|internalLinkHelper-suffix || 3 || 0
|-
|moveEditsection || 31 || 1
|-
|noteTA || data-sort-value="Infinity" | 默认 || data-sort-value="Infinity" | 默认
|-
|popupUserLanguage || 38 || 0
|-
|removeAccessKeys || 18 || 0
|-
|specialchars || 76 || 2
|-
|wikEd || 70 || 0
|-
|wikEd intl hans || 77 || 0
|-
|wikEd intl hant || 50 || 0
|-
|wikimediaplayer || 75 || 1
|}
* [[Special:GadgetUsage]]
* [[m:Meta:GUS2Wiki/Script|GUS2Wiki]]
<!-- data in CSV format:
AdvancedSiteNotices,default,default
Blackskin,15,0
Cat-a-lot,32,2
CleanDeleteReasons,default,default
Edittools-VFD,54,2
Edittools-ZHC,72,2
Edittools-admin,31,0
Edittools-cite,78,2
Edittools-default,60,1
Edittools-plus,123,2
Edittools-user,41,0
HotCat,105,3
JSL,88,2
Navigation popups,89,3
PreviewWithVariant,23,1
UTCLiveClock,91,2
blinktalk,34,0
contribsrange,52,2
easy-archive,10,1
edit0,87,2
hantsect,51,0
internalLinkHelper-altcolor,default,default
internalLinkHelper-cravix,2,0
internalLinkHelper-external,1,0
internalLinkHelper-ilbluehl,3,0
internalLinkHelper-redonly,1,0
internalLinkHelper-redplain,2,0
internalLinkHelper-redtipsy,3,1
internalLinkHelper-suffix,3,0
moveEditsection,31,1
noteTA,default,default
popupUserLanguage,38,0
removeAccessKeys,18,0
specialchars,76,2
wikEd,70,0
wikEd intl hans,77,0
wikEd intl hant,50,0
wikimediaplayer,75,1
-->
b2hap8vwzk52pqjznha2eebvlrkdtbj
CSS/Lengths and Units
0
32334
168508
168503
2022-08-17T12:30:59Z
Paho.mqtt
60409
/* 相对度量单位 */
wikitext
text/x-wiki
为指定宽度、高度或其他长度，可用的度量单位有：
<!-- Note: percentage is not a unit. -->
{| class="wikitable"
|+ CSS的度量单位
! Code
! 定义
! 注释
|-
| em
| 元素的字体的高度
|
|-
| ex
| 元素的字体的字母'x'的高度
|
|-
| px
| 像素
|
|-
| mm
| 毫米
|
|-
| cm
| 厘米
|
|-
| pt
| point (1/72 英寸)
|
|-
| pc
| pica (12 points, 即1/6英寸)
|
|-
| in
| 英寸
|
|}
长度也可表示为另一个长度的百分比。这可能使情况复杂化，因为基线长度随着属性的不同而不同。例如，用属性{{CSS:property|margin}}计算百分比是基于包含块的宽度。用属性{{CSS:property|font-size}}计算百分比，是基于父元素的{{CSS:property|font-size}}。而用属性{{CSS:property|line-height}}计算百分比，是基于当前元素的{{CSS:property|font-size}}。
屏幕上的字体尺寸最好基于百分比或以<code>em</code>为度量单位。这意味着页面将跟着用户字体选择而变化。用像素(<code>px</code>)为单位指定字体尺寸会导致一些问题，应该尽量避免。
绝对度量单位<code>mm</code>, <code>cm</code>, <code>pt</code>, <code>pc</code>, <code>in</code>在屏幕上工作不好，在很多老浏览器上会引发问题。这些用在打印时更安全。但即使打印，使用这些度量单位也与用户的选择难以交互。
== 相对度量单位 ==
3个度量单位：<code>em</code>, <code>ex</code>, <code>px</code>是相对度量单位。并不指出一个固定长度。而是随其他量的变化而变。对于<code>em</code>和<code>ex</code>，随某些元素的字体尺寸变化而变。
=== 屏幕像素, 打印机像素和CSS像素 ===
<code>px</code>单位指出''CSS像素''长度。它不同于屏幕像素, 打印机像素。
=== 计算 ===
{{BookCat}}
60frulmwb3lurv0ws0se216vs5ikt37
CSS/Rules
0
32335
168511
2022-08-17T12:39:26Z
Paho.mqtt
60409
创建页面，内容为“==语法== ::selector { declaration; declaration2; ...} declaration定义为: ::property: value”
wikitext
text/x-wiki
==语法==
::selector { declaration; declaration2; ...}
declaration定义为:
::property: value
hey74gxfxqdzhzbfl86w1zohwtuqgy3
168512
168511
2022-08-17T12:40:51Z
Paho.mqtt
60409
重定向页面至[[CSS/Defining Style Rules]]
wikitext
text/x-wiki
#REDIRECT [[CSS/Defining_Style_Rules]]
ijl6wx104qmldm23i3d310465ofzbkj