MediaWiki討論:Common.css/存檔1

由Cheng chai fung在話題把pre標籤的內容斬開上作出的最新留言:14 年前

-

請增加:

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

已經加上--百無一用是書生 () 12:09 2007年1月10日 (UTC)

內嵌字型

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)
想了想,補漢字是件大工程,而且內嵌字型會變得很肥,除非大家都是FTTx,不然還是算了。內嵌字型就用來美化英數字或像英文維基一樣用來補補拼音文字就好了。-- 百楽兎 04:00 2006年12月26日 (UTC)
有一個比較可取的方法,是在維基的server儲起所有可以顯示的字元(包括漢字以外的字元)的點陣圖像,然後用戶可以選擇在系統不能顯示文字時,調動內建的點陣字型圖像作替代。--石添小草 01:35 2006年12月28日 (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";
}

Dalt (留言) 2009年4月29日 (三) 04:58 (UTC)

發現IE仍然不支持:lang,只好改用屬性選擇子。以上代碼已經修改過,經測試對IEFirefoxOpera都有效。Dalt (留言) 2009年5月4日 (一) 02:21 (UTC)
增加了緬語Dalt (留言) 2009年5月12日 (二) 19:53 (UTC)

建議修改

請將

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)
 完成--Liangent (留言) 2009年5月25日 (一) 10:18 (UTC)


MediaWiki:Common.css的修改

  已解決

請見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)

提議修改系統的CSS

如以上的圖片所示,當一些條目像幽門螺桿菌一樣,圖片夾雜着文字時,圖片的上方會十分緊貼著文字,甚至會遮蓋部分文字。經過測試,發現在自己的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.jpgFile: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,可能效果更好。建議改成如下:
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)
 完成--Jimmy Xutalk·+ 2009年7月26日 (日) 17:18 (UTC)

提議修改MediaWiki:Common.css

加入(或修改為)如下代碼:

table {
    background: transparent;
}

目前非條目頁面背景並非白色,而表格的背景是白色的,能看出明顯的邊界。--達師147228 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)
返回 "Common.css/存档1" 頁面。