MediaWiki討論:Common.css/存檔1
本頁是以往討論的存檔。請勿編輯本頁。若您想發起新討論或重啟現有討論,請在當前討論頁進行。 |
-
請增加:
table.navbox {
background-color: #f9f9f9;
border: 1px solid #aaaaaa;
clear: both;
font-size: 90%;
margin: 1em 0em 0em;
padding: 5px;
text-align: center;
width: 100%;
}
有的template里要用到,英文維基里有這個class (class="navbox") 地址:http://en.wikipedia.org/wiki/MediaWiki:Common.css Canstudent 04:59 2006年11月30日 (UTC)cantudent
內嵌字型
from Wikipedia:互助客棧/技術
英文維基今天開始一個內嵌字型的實驗(詳見: [1]),我想我們是不是也可以試試看內嵌字型,專補一些缺字問題。-- 百楽兎 15:41 2006年12月25日 (UTC)
- 恐怕只是IE支援的吧?內嵌字型從IE5好像已經有了……--翔風·艾倫·獲加☆有事找我*^-^* 00:13 2006年12月26日 (UTC)
- 有個叫 Microsoft Web Embedding Font Tool 的軟件能製作 EOT 字體,教程見:讓網頁特殊字體輕鬆Show出來
另外,還有一個關於 Web 字體的安全公告,見:嵌入式 Web 字體中的漏洞可能允許遠程執行代碼 (908519)--翔風·艾倫·獲加☆有事找我*^-^* 00:18 2006年12月26日 (UTC) - 但是中文中缺乏的是EXT-B的甚至是EXT-C字,這未必能以內嵌字型完成的(涉及系統編碼問題),而且Firefox不支援內嵌字型--翔風·艾倫·獲加☆有事找我*^-^* 00:21 2006年12月26日 (UTC)
多語言支持
建議增加語言偽類,以配合Template:lang模板實現對多語言字體和版式的選擇。英文維基百科就是這樣處理的:en:MediaWiki:Common.css。
大語種一般系統和瀏覽器都有默認支持,所以只需要添加小語種。現在碰到的有藏語、傣仂語、蒙古語、滿語等:
[lang="bo"] {
/* 藏文 */
font-family: "Tibetan Machine Uni", "Microsoft Himalaya";
}
[lang="my"] {
/* 缅文 */
font-family: Padauk, Myanmar3, Parabaik, "MyMyanmar Unicode", Myanmar2;
}
[lang="khb"] {
/* 新傣仂文 */
font-family: "Dai Banna SIL Book", "Dai Banna SIL Light";
}
[lang="mn-Mong"], [lang="mnc"], [lang="sjo"] {
/* 传统蒙古文、满文、锡伯文 */
writing-mode: tb-lr;
font-family: "Mongolian Baiti", "Daicing White";
}
建議修改
請將
ol.references > li:target ,
sup.reference:target {
background-color: #DDEEFF;
}
改成
ol.references > li:target ,
sup.reference:target,
cite:target {
background-color: #DDEEFF;
}
其用途在於{{harvnb}}裏頭二次跳躍用到,即縮減在註釋時參考書目,然後跳躍到參考書目,第二次跳躍後不會反白/高亮度顯示。正確效果如en:243 Ida,目前未修正版本演示如條目廣義相對論、焊接等等。多謝。--Zanhsieh (留言) 2009年5月23日 (六) 17:18 (UTC)
- 另英文維基有這項:en:MediaWiki:Common.css--Zanhsieh (留言) 2009年5月24日 (日) 22:23 (UTC)
請見MediaWiki_talk:Common.css#建議修改,感謝。--Zanhsieh (留言) 2009年5月24日 (日) 00:26 (UTC)
- 效果應該沒問題,但把cite:target全部加上會不會影響其他地方?或者,先給{{Citation}}加上一個class?--Liangent (留言) 2009年5月24日 (日) 06:04 (UTC)
- 不會有問題。另外,:target 這個用法無法在 inline CSS 使用,因為它是 psudeo-class (跟 :hover, :visited 等是一樣的),僅能在 in-page style sheet 使用。--Zanhsieh (留言) 2009年5月24日 (日) 17:45 (UTC)
- 完成,enwiki也是這樣的。我原來是想說citation加class="xx",然後.xx來加顏色。--Liangent (留言) 2009年5月25日 (一) 10:14 (UTC)
- 多謝。--Zanhsieh (留言) 2009年5月25日 (一) 14:06 (UTC)
- 完成,enwiki也是這樣的。我原來是想說citation加class="xx",然後.xx來加顏色。--Liangent (留言) 2009年5月25日 (一) 10:14 (UTC)
- 不會有問題。另外,:target 這個用法無法在 inline CSS 使用,因為它是 psudeo-class (跟 :hover, :visited 等是一樣的),僅能在 in-page style sheet 使用。--Zanhsieh (留言) 2009年5月24日 (日) 17:45 (UTC)
提議修改系統的CSS
-
用 Chrome 2.0.180.0 瀏覽
-
用 Firefox 3.0.10 瀏覽
-
用 IE 8 瀏覽
-
用 Safari 4 beta 瀏覽
如以上的圖片所示,當一些條目像幽門螺桿菌一樣,圖片夾雜着文字時,圖片的上方會十分緊貼著文字,甚至會遮蓋部分文字。經過測試,發現在自己的monobook.css裏加入如下的code可解決問題:
div.thumb {
border-top: 1em solid #FFFFFF;
margin-top: 1em;
}
由於這個問題應該是對大多數人都有影響的,所以在此建議管理員在系統的CSS設定檔加入以上的code。 —Quest for Truth (留言) 2009年5月19日 (二) 21:59 (UTC)
- 沒看懂是什麼意思--Liangent (留言) 2009年5月20日 (三) 10:28 (UTC)
- 我所附上的圖片顯示幽門螺桿菌(這只是例子,其他條目同樣存在問題)條目用不同瀏覽器瀏覽時所見的內容,條目裏的兩幅圖片File:Helicobacter pylori.jpg和File:H pylori ulcer diagram ja.png太過緊貼其上方的文字(但是卻與下方和左右兩側的文字保持一定距離),其中以IE的情況最糟,有文字更被圖片遮蓋而看不見。
- 我自己的解決辦法是在自己的Special:MyPage/monobook.css加入那些code,加闊圖片與上方文字的距離,你可以在自己的monobook.css測試,比較該條目前後的效果。如果你知道系統的那一個CSS負責有關的code的話,建議加入這些code。 —Quest for Truth (留言) 2009年5月20日 (三) 18:14 (UTC)
- 我認為應該與 http://zh.wikipedia.org/skins-1.5/monobook/main.css 有關,第438行開始(thumbnails)。 —Quest for Truth (留言) 2009年5月21日 (四) 09:55 (UTC)
是在說class為thumb的div有時會遮蓋住文字的問題吧。已經把相應代碼加入MediaWiki:Common.css。--菲菇@維基食用菌協會 2009年5月21日 (四) 13:53 (UTC)
- 頂部加寬可以解決問題,但長期以來的排版都是依著這個限制調整的,現在一變,全走了樣。例如:
1. 凡在頂部的thumb圖片皆猶如空一行向下,怪得很。
2. 數個thumb圖片堆疊的排版,其行距變成兩倍,明顯不協調。
各位再考慮得失一下吧。--百楽兎 2009年5月21日 (四) 14:06 (UTC)- 這麼說,1em會不會大了點?--凍僵的河蟹talk·+ 2009年5月21日 (四) 14:36 (UTC)
- 或許1em的確太大,有待測試一個合適的數值,至於數個thumb圖片堆疊的問題,或許要將bottom的數值相應調較? —Quest for Truth (留言) 2009年5月21日 (四) 16:37 (UTC)
- 發現將<p>也一併修改,加大與下方margin,並相應縮小上方margin,可能效果更好。建議改成如下:
- 這麼說,1em會不會大了點?--凍僵的河蟹talk·+ 2009年5月21日 (四) 14:36 (UTC)
div.thumb {
border-top: 0.7em solid #FFFFFF;
margin-top: 0.7em;
border-bottom: 0.2em;
margin-bottom: 0.2em
}
p {
margin: 0.2em 0 0.8em;
}
請試試看。 —Quest for Truth (留言) 2009年5月21日 (四) 18:02 (UTC)
{{Navbox}}樣式碼
請管理員將「navigation boxes」一段舊原始碼替換成以下英文維基en:MediaWiki:Common.css新原始碼:
/* Default skin for navigation boxes */
table.navbox { /* Navbox container style */
border: 1px solid #aaa;
width: 100%;
margin: auto;
clear: both;
font-size: 88%;
text-align: center;
padding: 1px;
}
table.navbox + table.navbox { /* Single pixel border between adjacent navboxes */
margin-top: -1px; /* (doesn't work for IE6, but that's okay) */
}
.navbox-title,
.navbox-abovebelow,
table.navbox th {
text-align: center; /* Title and above/below styles */
padding-left: 1em;
padding-right: 1em;
}
.navbox-group { /* Group style */
white-space: nowrap;
text-align: right;
font-weight: bold;
padding-left: 1em;
padding-right: 1em;
}
.navbox, .navbox-subgroup {
background: #fdfdfd; /* Background color */
}
.navbox-list {
border-color: #fdfdfd; /* Must match background color */
}
.navbox-title,
table.navbox th {
background: #ccccff; /* Level 1 color */
}
.navbox-abovebelow,
.navbox-group,
.navbox-subgroup .navbox-title {
background: #ddddff; /* Level 2 color */
}
.navbox-subgroup .navbox-group, .navbox-subgroup .navbox-abovebelow {
background: #e6e6ff; /* Level 3 color */
}
.navbox-even {
background: #f7f7f7; /* Even row striping */
}
.navbox-odd {
background: transparent; /* Odd row striping */
}
.collapseButton { /* 'show'/'hide' buttons created dynamically */
float: right; /* by the CollapsibleTables javascript in */
font-weight: normal; /* [[MediaWiki:Common.js]]are styled here */
text-align: right; /* so they can be customised. */
width: auto;
}
.navbox .collapseButton { /* In navboxes, the show/hide button balances */
width: 6em; /* the vde links from [[Template:Tnavbar]], */
} /* so they need to be the same width. */
以便更新{{Navbox}}模板,謝謝。—lkopeter (留言) 2009年7月22日 (三) 18:35 (UTC)
- 補充:因為有用戶不滿現時{{Navbox}}的字體大小,故請求更新現有樣式碼,請管理員盡快跟進,謝謝。—lkopeter (留言) 2009年7月24日 (五) 15:11 (UTC)
加入(或修改為)如下代碼:
table {
background: transparent;
}
目前非條目頁面背景並非白色,而表格的背景是白色的,能看出明顯的邊界。--達師 - 147 - 228 2010年10月23日 (六) 12:48 (UTC)
把pre標籤的內容斬開
建議修改MediaWiki:Common.css,把所有的pre標籤的內容斬開,除去越界問題。
pre {
word-break: break-all;
word-wrap: break-word;
}
word-break: break-all;是給舊版瀏覽器,如果有更新瀏覽器,除了Firefox外其他都用到word-wrap: break-word;。基本上只有Firefox兩行都不支援。
-- 廢 話 + 2010年10月28日 (四) 09:13 (UTC)
- pre是代碼格式,代碼是不應自動換行的。與其抱怨自己寫的代碼會越界,怎不想想加幾個回車讓它保持在界內。另外,如果打算用pre來實現非代碼的功能,那麼我覺得還是換一種好,pre內的內容是不會被繁簡轉換的。--菲菇@維基食用菌協會 2010年10月28日 (四) 17:46 (UTC)
- 其實都不太關寫代碼事,只是寫template的使用指引時某些位置不能斷行,而用到註釋斷行又有點怪-- 廢 話 + 2010年10月29日 (五) 11:01 (UTC)
- 代碼最好用<source>語法--百無一用是書生 (☎) 2010年10月29日 (五) 01:44 (UTC)
- 用<source>代碼都不行,因為它是把<source>轉換成<pre>來實現的,到頭來也是跟<pre>有關。而且,如果是寫css和js,更加不會用到<source>-- 廢 話 + 2010年10月29日 (五) 11:01 (UTC)
- <source lang=javascript>, <source lang=css>--百無一用是書生 (☎) 2010年10月29日 (五) 11:38 (UTC)
- 即是說,例如如果用到<source lang="cpp">,那會給轉換做<div class="cpp source-cpp" style="font-family:monospace;"><pre class="de1"> … </pre></div>才顯示出來,實際上<source>和<pre>沒太大分別。(<source>只用作給程式碼標上顏色)-- 廢 話 + 2010年10月29日 (五) 12:08 (UTC)
- <source lang=javascript>, <source lang=css>--百無一用是書生 (☎) 2010年10月29日 (五) 11:38 (UTC)
- 用<source>代碼都不行,因為它是把<source>轉換成<pre>來實現的,到頭來也是跟<pre>有關。而且,如果是寫css和js,更加不會用到<source>-- 廢 話 + 2010年10月29日 (五) 11:01 (UTC)