MediaWiki討論:Common.css/存檔3
本頁是以往討論的存檔。請勿編輯本頁。若您想發起新討論或重啟現有討論,請在當前討論頁進行。 |
將預設字形大小調整為14.5px 或15px
- 繁中頁面預設顯示的字形大小是新細明體 14px。但是新細明體14px 的顯示效果非常差,是無法忍受的差。具體缺筆我說不明白,如筆劃會黏在一起,看起來很「虛」。簡中使用者可能不明白,但繁中使用者應該很清楚,並且同意以上說法。新細明體 在 12,13,15,16px 都沒有問題,但是在14 px時會有這個缺陷。 所以我建議將維基百科內文的預設字體大小改為 14.5px 或 15 px。
- 瀏覽器Edge 顯示的大小是16 px,所以不會出現上述問題。 Chrome, firefox 有這個問題、其他不知。
- 技術上多半沒問題,更改影響範圍只有中文維基百科的內文。
- 簡中雅黑體沒這個問題
- 新細明體 14px, 15px, 微軟雅黑體 14px 比較圖 https://i.imgur.com/z61HHlH.png (編輯 : 2016/07/01)
Golopotw(留言) 2016年6月26日 (日) 17:56 (UTC)
- 維基百科用的是em,不是px....--百無一用是書生 (☎) 2016年6月27日 (一) 01:56 (UTC)
- 在 MediaWiki:Common.css 加上
.mw-body-content{ font-size:0.91em; }
, 原本 0.875em -> 14px, 現在 0.91em -> 14.5px ... em 是相對單位,最後瀏覽器還是會計算出一個 px大小,依據 px大小來顯示字形,Golopotw(留言) 2016年6月27日 (一) 09:23 (UTC)
- 在 MediaWiki:Common.css 加上
- 中文網頁字體儘量以偶數為宜--百無一用是書生 (☎) 2016年6月28日 (二) 06:02 (UTC)
- @Shizhao:並沒有這樣的要求,該說法的緣起應該是Windows自帶的中易宋體只內嵌了偶數的點陣字形,實則在指定奇數字號時會以低一級的字號顯示,同時字符間距增大1px,反而可讀性更強。我支持增大到15px,顯示效果可以參考吳語維基百科。--藍燈 留言 2016年6月29日 (三) 05:46 (UTC)
- 打開吳語維基,覺得整個世界都明亮了。烏拉跨氪 2016年6月29日 (三) 20:39 (UTC)
- @Shizhao:並沒有這樣的要求,該說法的緣起應該是Windows自帶的中易宋體只內嵌了偶數的點陣字形,實則在指定奇數字號時會以低一級的字號顯示,同時字符間距增大1px,反而可讀性更強。我支持增大到15px,顯示效果可以參考吳語維基百科。--藍燈 留言 2016年6月29日 (三) 05:46 (UTC)
- 中文網頁字體儘量以偶數為宜--百無一用是書生 (☎) 2016年6月28日 (二) 06:02 (UTC)
- 請善用瀏覽器本身的字體設置,或Special:Mypage/common.css。--Gqqnb(留言) 2016年6月29日 (三) 21:05 (UTC)
- 有很多其他使用者不會另外調整大小,特別是新接觸維基百科的人,或者是對科技不熟的老人。他們要忍受難以閱讀的字體,或者乾脆不使用維基百科。(另外大概自我有記憶以來,我一直都用ctrl + + 來調整頁面大小到 110%,來避開 14px 新細明體)。 Golopotw(留言) 2016年7月1日 (五) 02:18 (UTC)
- 那是使用者自己不會。14px顯示在顯示器上是幾毫米還跟作業系統、顯示器有關。然後顯示出來的字被人看到眼睛裏有多舒服又跟人本身、坐姿等有關,你怎麼能保證你喜歡的14像素在其他人、其他環境也適用?--Gqqnb(留言) 2016年7月14日 (四) 02:57 (UTC)
- 有很多其他使用者不會另外調整大小,特別是新接觸維基百科的人,或者是對科技不熟的老人。他們要忍受難以閱讀的字體,或者乾脆不使用維基百科。(另外大概自我有記憶以來,我一直都用ctrl + + 來調整頁面大小到 110%,來避開 14px 新細明體)。 Golopotw(留言) 2016年7月1日 (五) 02:18 (UTC)
- 新細明體 14px, 15px, 微軟雅黑體 14px 比較圖 https://i.imgur.com/z61HHlH.png Golopotw(留言) 2016年7月1日 (五) 02:52 (UTC)
- 美國夏威夷 新細明體 14px(五號字)
- 美國夏威夷 新細明體 14.5px
- 美國夏威夷 新細明體 15px
- 美國夏威夷 Microsoft JhengHei 14px(五號字)
- 美國夏威夷 Microsoft JhengHei 14.5px
- 美國夏威夷 Microsoft JhengHei 15px
- (7月4日)縮放級別設置為100%,見 Internet Explorer 9,測試機操作系統是 Windows 7。
- 這是微軟字體的一個 bug(版本號是7.0的 mingliu.ttc 的 EBDT 表有11、12、13、15、16、20 px的 strike 數據,但是缺少14px strike 的數據,不像版本號是5.0的宋體有12、13、14、15、16、17 px 的 strike 數據),我沒看到有人在微軟官方論壇討論這個問題。—John Doe 120(talk) 2016年7月1日 (五) 14:56 (UTC)
- 希望不要歪到手動定字體的問題上,個人最討厭寫一堆中文 fallback 的網頁了(每次都會被我餵一個 stylish 殺掉)……
- 另外現時大部分新設備都不是 96dpi CSS 的設備了,例如我現在這個 Chrome 就開了 1.25 的 Device Pixel Ratio,看你的 14px 實際上是 (14 * 1.25)px,結果就是毫無對比意義。各位目測對比時也請注意這點。--Artoria2e5編 保持頁面整潔,直接ping我回復。 2016年7月4日 (一) 08:57 (UTC)
- 我在 Windows 8.1虛擬機試過什麼 scaling,重啟虛擬機後打開 Microsoft Network Monitor,發現有些圖標尺寸不變,然後右鍵點擊 Microsoft Network Monitor,設置什麼縮放,重新打開應用,發現有問題。—John Doe 120(talk) 2016年7月4日 (一) 11:21 (UTC)
- 多嘴一句:「五號字」的完整換算參見點_(印刷),CSS 96dpi "px" 數為 10.5/72*96 = 14。--Artoria2e5編 保持頁面整潔,直接ping我回復。 2016年7月4日 (一) 09:00 (UTC)
-
.mw-body-content{ font-size:0.875em; } (新細明體 14px)
-
.mw-body-content{ font-size:0.90625em; } (新細明體 14.5px)
-
.mw-body-content{ font-size:0.9375em; } (新細明體 15px)
-
.mw-body-content{ font-size:0.96875em; } (新細明體 15.5px)
-
.mw-body-content{ font-size:1.0em; } (新細明體 16px)
我也一直以為是自己的近視越來越深,免得過就不要用公眾電腦上中文維基,迫不得已的話就要先花些功夫設定放大比率……剛才我用自己的Special:Mypage/common.css實驗了一會,發現果然有着明顯的分別,15px的感覺尤其明顯,登時眼前雪亮。縱使每部電腦都可以有不同的自訂縮放比率,但既然維基百科有一大篇WP:格式手冊/親和力,可見維基百科是希望其他人看得舒舒服服的。若然現時的預設值是迫人每次都要放大縮小一番才能看清楚每隻字,那就未必太低親和度了,希望管理員點下我預備的五幅截圖。其實原裝的css font size 應該只是從英文維基移植過來的,沒有甚麼原因非要0.875em不可,希望能改成更適合中文字體的大小。--Quest for Truth(留言) 2016年7月19日 (二) 07:21 (UTC)
- (~)補充也可以到用戶:Quest for Truth/Font size在同一頁看到5幅截圖。--Quest for Truth(留言) 2016年7月21日 (四) 01:13 (UTC)
頁面存廢討論 和 檔案存廢討論 ,action=info的h2元素減法
請求已處理
偶然發現這倆個頁面的action=info的h2元素也受到「/* 存廢討論舊樣式 */」的樣式影響,能不能做一個減法還原?action=info的body有一個「action-info」的class可以識別。——路過圍觀的Sakamotosan 2016年10月19日 (三) 08:40 (UTC)
- 或者使用class的「action-view」,因為這個action是指頁面處於查看狀態的。這樣可以限制只在查看頁面生效,而不影響其他action頁面。
/* 存废讨论旧样式 */
body.ns-4.action-view[class*=" page-Wikipedia_頁面存廢討論_"] h2,
body.ns-4.action-view[class*=" page-Wikipedia_檔案存廢討論_"] h2 {
border-bottom: none;
font-size: 132%;
margin-bottom: .3em;
}
body.ns-4.action-view[class*=" page-Wikipedia_頁面存廢討論_"] h3,
body.ns-4.action-view[class*=" page-Wikipedia_檔案存廢討論_"] h3 {
font-size: 116%;
margin-bottom: .3em;
}
——路過圍觀的Sakamotosan 2016年10月19日 (三) 08:43 (UTC)
- @Jimmy Xu、Liangent、Shizhao:。——路過圍觀的Sakamotosan 2016年10月19日 (三) 08:45 (UTC)
- 完成。--Jimmy Xu 論 2016年10月20日 (四) 01:36 (UTC)
- 如果編輯和預覽action都有效的話,應該還要加上「action-submit」。——路過圍觀的Sakamotosan 2016年10月20日 (四) 01:54 (UTC)
- 這樣說的話反而覺得action=info差一點也無所謂了。--Jimmy Xu 論 2016年10月20日 (四) 11:15 (UTC)
- 因為見加多了action-edit,我認為是不是也想edit下也能生效,但是試了一下edit,發覺預覽下看不出效果,所以看了一下,action-submit,所以如果edit都要生效的話,應該加多是action-submit。action-info是「頁面信息」頁,顯然裏面的h2元素並不需要外面查看頁的修改吧。——路過圍觀的Sakamotosan 2016年10月20日 (四) 11:34 (UTC)
- 因為只是希望在查看和預覽時起到「存廢討論舊樣式」的效果,所以我覺得把現在的action-edit改成action-submit就行了,不用再做加法了。action-edit是沒有預覽的時候。 --碸中嘌呤的白磷萃取 打譜 2017年4月29日 (六) 11:52 (UTC)
- 沒問題的話,應該可以了。——路過圍觀的Sakamotosan 2017年5月9日 (二) 03:05 (UTC)
- 因為只是希望在查看和預覽時起到「存廢討論舊樣式」的效果,所以我覺得把現在的action-edit改成action-submit就行了,不用再做加法了。action-edit是沒有預覽的時候。 --碸中嘌呤的白磷萃取 打譜 2017年4月29日 (六) 11:52 (UTC)
- 因為見加多了action-edit,我認為是不是也想edit下也能生效,但是試了一下edit,發覺預覽下看不出效果,所以看了一下,action-submit,所以如果edit都要生效的話,應該加多是action-submit。action-info是「頁面信息」頁,顯然裏面的h2元素並不需要外面查看頁的修改吧。——路過圍觀的Sakamotosan 2016年10月20日 (四) 11:34 (UTC)
- 這樣說的話反而覺得action=info差一點也無所謂了。--Jimmy Xu 論 2016年10月20日 (四) 11:15 (UTC)
- 如果編輯和預覽action都有效的話,應該還要加上「action-submit」。——路過圍觀的Sakamotosan 2016年10月20日 (四) 01:54 (UTC)
- 自己處理了。 --碸中嘌呤的白磷萃取 打譜 2017年6月9日 (五) 18:42 (UTC)
首頁特色條目展出中的公示圖被錯誤加上左圖使用的margin
MediaWiki:Common.css裏面有一條規則,用來在特色展出圖旁邊加空白:
#mp-2012 #column-feature img, #mp-2012 #column-good img {
margin: 0.4em 0.9em 0.3em 0; /* 上 右 下 左 */
}
可是這個image打得太歪,打中了公式svg回落的img元素,結果變成了 https://archive.fo/WBlxt 或者 https://archive.fo/WBlxt/image 記錄下來的樣子。建議在img後面加一個:not(.mwe-math-fallback-image-inline)
例外繞過。——Artoria2e5編 討論要完整,回復請用ping。 2017年3月24日 (五) 02:41 (UTC)
- 已修復,換了個方法寫,以免:not()有瀏覽器不支持。Liangent(留言) 2017年3月24日 (五) 15:18 (UTC)
把英語維基的 common.css複製過來,再加上中文維基需要的碼
(原討論在VPT被存檔了,重貼一次。)
把 common.css分成兩部份,第一部份是英文維基的複製貼上,第二部份是中文維基style的額外需求。
好處是英語維基的 patch可以快速套用到中文維基裏,共享英語維基的碼。第二好處是兩者的 diff非常明顯。 Golopotw(留言) 2017年4月15日 (六) 14:36 (UTC)
Edit requests
(移動自互助客棧)Golopotw(留言) 2017年7月22日 (六) 23:44 (UTC)
請求已處理
Edit request on mediawiki: common.css, 1
移除「首頁不顯示紅鏈」。如果首頁有紅鏈,應該要修改內容,而不是讓讀者點進去發現是紅鏈。
/* 首页不显示红链 */
body.ns-4.page-Wikipedia_首页 #mw-content-text a.new {
color: inherit;
}
Golopotw(留言) 2017年7月10日 (一) 15:46 (UTC)
- 這個可能需要討論一下才好做--百無一用是書生 (☎) 2017年7月11日 (二) 06:58 (UTC)
- 這一項已經存在有一段時間了(參見css頁面第一段)--Ben.mq 2017年8月5日 (六) 23:08 (UTC)
Edit request on mediawiki: common.css, 2
Move the following rules to the top, for better coding style.
.new
.hidden
small
big
cite
blockquote
Golopotw(留言) 2017年7月10日 (一) 16:10 (UTC)
Edit request on mediawiki: common.css, 3
Pull changes on .hlist
from enwik.
Golopotw(留言) 2017年7月10日 (一) 16:34 (UTC)
Edit request on mediawiki: common.css, 4
Move code sections around to align with enwiki's codes for easier diff.
Current section orders:
enwiki:
...
.hlist
.plainlist
.navbox
.infobox
.wikitable
div.medialist
a[href$=".pdf"].external
div.columns
.messagebox
table.ambox
|
zhwiki:
div.columns
.hlist
.plainlist
div.medialist
.infobox
.navbox
.messagebox
a[href$=".pdf"].external
.mcBoto
table.ambox
|
Golopotw(留言) 2017年7月10日 (一) 17:10 (UTC)
Edit request on mediawiki: common.css, 5
Remove commented code starting with
/* Do not expand kvaleberg.com-URLs for printing
#content
...
*/
Golopotw(留言) 2017年7月10日 (一) 17:14 (UTC)
疑問
我們招了一名rv嗎?——路過圍觀的Sakamotosan 2017年7月11日 (二) 00:55 (UTC)
- 第四項的話,目前
.wikitable
對中文的支持如何?--Liuxinyu970226(留言) 2017年7月11日 (二) 07:21 (UTC)- wikitable類不是一直在用?——路過圍觀的Sakamotosan 2017年7月11日 (二) 07:27 (UTC)
- wikitable是默認內置的吧--百無一用是書生 (☎) 2017年7月12日 (三) 07:20 (UTC)
編輯請求:關於「用於一些特殊的不需要標題欄的頁面」
請求已處理
/* 用于一些特殊的不需要标题栏的页面 */
body.ns-4.page-Wikipedia_頁面存廢討論_疑似侵權 #wpSummaryLabel,
body.ns-4.page-Wikipedia_頁面存廢討論_疑似侵權 #wpSummary,
body.ns-4.page-Wikipedia_关注度_提报 #wpSummaryLabel,
body.ns-4.page-Wikipedia_关注度_提报 #wpSummary {
display: none !important;
}
手動提存廢討論和關注度提報的時候,#wpSummary 顯示為標題欄,這時確實不需要顯示。但是有時會有直接編輯頁面的需求,並且這時通常都需要填寫摘要,因此應該如果是添加新章節才不顯示,否則仍顯示。 --碸中嘌呤的白磷萃取 打譜 2018年4月24日 (二) 10:35 (UTC)
- 完成,使用及JS處理。--Xiplus#Talk 2018年5月13日 (日) 05:58 (UTC)
hatnote非居中很奇怪
@shizhao:例子,頂注消歧義貼靠上方的維護模板,1.2em顯得與正文相距太遠。如果margin-top和margin-bottom各0.6em則效果不錯,但不知道代碼註釋所說的錯行問題是怎樣。--YFdyh000(留言) 2018年9月18日 (二) 01:30 (UTC)
- 按照推薦的規範,頂注應該位於維護模板上方。所以你說的問題也就不存在了。錯行問題不知道你指的是哪個?--百無一用是書生 (☎) 2018年9月18日 (二) 02:53 (UTC)
- 錯行問題是指:多個hatnote模板連用的時候,正常行間距下,左側圖標可能會在某些情況下導致下一行的hatnote縮進。1.2em是我之前能找到的比較合理的間距大小,不會導致錯行發生。暫時調到了0.8em,你看看如何?--百無一用是書生 (☎) 2018年9月18日 (二) 03:51 (UTC)
- 目前可以了,居中就好。--YFdyh000(留言) 2018年9月19日 (三) 09:27 (UTC)
編輯請求
請求已處理
希望能將
.hlist li:after {
content: " ·";
font-weight: bold;
}
改成
.hlist li:after {
content: " · ";
font-weight: bold;
}
理由:例如{{#invoke:list|horizontal|First item|Second item|Third item}}生成的水平點列列表,兩個item之間的點和該點所隔開的兩個item距離不一致(例如「First item ·Second item」),看着有些不舒服,像這樣顯示我覺得會更好一些:「First item · Second item」。--№.N(留言) 2019年4月24日 (三) 09:46 (UTC)
建議將common.css小工具化
建議仿照MediaWiki官網做法,將MediaWiki:common.css做成MediaWiki:Gadget-site.css等小工具(gadgetize),以解決手機版很多css不起作用問題。JavaScript類似。如果有其他可以解決手機版css問題的辦法也可以提出。
另外,為什麼{{doc}}的結尾框有一句樣式是硬編碼的,有點不理解。——SolidBlock留言 2019年10月27日 (日) 00:08 (UTC)
- MediaWiki:common.css中的內容,極少部分可能可以做成小工具,部分內容應該可以做成模板樣式。其他涉及全站的內容變不了。但是這些都需要大量開發與測試工作才行。--百無一用是書生 (☎) 2019年10月28日 (一) 02:47 (UTC)
- 具體手機版哪些css不起作用啊?很多不起作用都是特意為之的--百無一用是書生 (☎) 2019年10月28日 (一) 02:52 (UTC)
- @shizhao:像{{documentation subpage}}、{{doc}}之類的。模板樣式應該可行。{{shortcut}}在手機版顯示正常。--SolidBlock留言 2019年11月1日 (五) 10:56 (UTC)
- @shizhao:ambox、navbox之類的需要反覆使用,使用小工具化或common.css較為合適。doc的話可以考慮將css內聯,但可能引起其他小工具或用戶css對doc作用不佳。——SolidBlock留言 2019年11月9日 (六) 16:34 (UTC)
.plainrowheaders
英文維基百科en:Mediawiki:Common.css有個.plainrowheaders的class:
/* Normal font styling for wikitable row headers with scope="row" tag */
.wikitable.plainrowheaders th[scope=row] {
font-weight: normal;
/* @noflip */
text-align: left;
}
使用.plainrowheaders的表格,行標題格(! scope="row" | ...)將取消粗體並恢復左對齊,但保留題頭單元格的淡灰底色,效果見此。
建議中文維基引入這個樣式,一方面能方便消除粗體/居中的尷尬,另一方面也能鼓勵使用scope屬性增加可讀性。--Lopullinen(留言) 2019年12月1日 (日) 14:42 (UTC)
編輯請求 2020-07-26
請求已拒絕
/* Highlight clicked reference in blue to help navigation */
ol.references li:target,
sup.reference:target,
span.citation:target {
background-color: #DEF;
}
/* Highlight clicked reference in blue to help navigation */
sup.reference,
span.citation,
div.citation {
display: block;
width: 100%;
}
ol.references li:target,
sup.reference:target,
span.citation:target,
div.citation:target {
background-color: #DEF;
}
將第一個Syntax Highlight改為第二個Syntax Highlight的內容。sup
和span
的屬性為inline
,沒有寬度和高度,因此設定背景不會有顏色。 2020年7月26日 (日) 04:32 (UTC)
- 未完成,實測顯示效果不正確,腳註標記全部換行了。--Xiplus#Talk 2020年8月2日 (日) 12:21 (UTC)
- @Xiplus:ㄚ,抱歉,我搞錯用途了,看了原始碼才知道原來那是標記。 2020年8月2日 (日) 13:16 (UTC)
編輯請求 2020-08-09
請求已處理--Xiplus#Talk 2020年9月30日 (三) 08:37 (UTC)
.hlist dl dl:before,
.hlist ol ol:before,
.hlist ul ul:before {
content: "(";
}
.hlist dl dl:after,
.hlist ol ol:after,
.hlist ul ul:after {
content: ")";
}
格式手冊:全形小括號使用在標示用途(註釋文字內容或作出補充說明)。 2020年8月9日 (日) 12:00 (UTC)
- (+)支持。—— Eric Liu 創造は生命(留言.留名.學生會) 2020年8月10日 (一) 15:40 (UTC)
- (+)強烈支持-- Sunny00217 2020年8月11日 (二) 01:37 (UTC)
- @Pseudo Classes:僅憑這樣資訊我無法判斷這個修改是否會有不良影響,您能否提供數個不同情況的使用樣例。 Xiplus#Talk 2020年8月16日 (日) 11:57 (UTC)
- @Xiplus:已知目前常用
hlist
的模板為Template:Navbox和Template:Infobox,其他使用樣例可見Template:Select variant。 2020年8月19日 (三) 12:03 (UTC)
- @Xiplus:已知目前常用
- @Xiplus、Ericliu1912、Pseudo Classes、Sunny00217:此修改將半角空格改為全形空格後,在使用hlist的模板里,括號前仍然會有一個空格。請問是否可以將該空格刪去?--Tim Wu(留言) 2020年10月19日 (一) 13:57 (UTC)
- (+)強烈支持:正想解決這個問題,卻一直找不到討論在哪裏,感謝召喚。—— Eric Liu 創造は生命(留言.留名.學生會) 2020年10月19日 (一) 16:17 (UTC)
- 似乎是早期因為樣式過醜而自行加入的?(倒沒看到這個問題)話說學生會怎還在簽名內呢(疑惑-- Sunny00217 2020年10月21日 (三) 09:51 (UTC)
請增加針對Wordmark和Tagline圖標的簡體替換
請求已處理--Xiplus#Talk 2020年8月28日 (五) 10:36 (UTC)
由於T260908和T258552造成的錯誤,我在修復該問題的時候順便把正確的簡體和繁體Wordmark和Tagline的文件。請增加針對Wordmark和Tagline圖標的簡體替換。--VulpesVulpes825(留言) 2020年8月24日 (一) 11:48 (UTC)
- @VulpesVulpes825:兩個問題:
兩個工單ID是一樣的,(?) 喵喵喵?a.mw-logo span.mw-logo-container img.mw-logo-wordmark
和a.mw-logo span.mw-logo-container img.mw-logo-tagline
似乎只能從common.js動手改src?
- -- Sunny00217 2020年8月24日 (一) 12:43 (UTC)
- @Xiplus:Timeless皮膚依然未轉換,請您協助添加這段CSS:
div.ts-inner div.mw-portlet img:lang(zh-hans), div.ts-inner div.mw-portlet img:lang(zh-cn), div.ts-inner div.mw-portlet img:lang(zh-my), div.ts-inner div.mw-portlet img:lang(zh-sg) {
content: url(/static/images/mobile/copyright/wikipedia-wordmark-zh-hans.svg)
}