iT邦幫忙

1

IT幫有兩種網頁版本!??怎麼一種好難閱讀

  • 分享至 

  • xImage

我發現IT邦的網頁有兩種版本

一個是後面加上sc=iThomeR

一個是沒有


[JS Library 學習筆記:嘿!有聽過 GSAP 嗎? (一)](https://ithelp.ithome.com.tw/articles/10272580?sc=iThomeR)

[JS Library 學習筆記:嘿!有聽過 GSAP 嗎? (一)](https://ithelp.ithome.com.tw/m/articles/10272580)

有沒有比較資深的大大知道這兩個版本之間的差別
以及這其中的歷史呀!??

froce iT邦大師 1 級 ‧ 2023-03-22 13:16:31 檢舉
一個是電腦版面一個是手機版面。
而且他分辨的重點不是後面的query好嗎...重點是網址中間的那個m。
你要 https://ithelp.ithome.com.tw/articles/10272580?aa=bbb 都行。
其實不管哪個版本,不喜歡就自己改,裝 CSS編修套件自己改一改,高興怎麼搞就怎麼搞啊
謝謝兩位大師的意見 學到很多
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

6
貓虎皮
iT邦新手 3 級 ‧ 2023-03-22 22:28:26
最佳解答

暫且先將此二網址分別稱作d_url與m_url,如下:

"https://ithelp.ithome.com.tw/articles/10272580?sc=iThomeR" # d_url
"https://ithelp.ithome.com.tw/m/articles/10272580" # m_url

在此二網址中可以發現其不同之處除了在於d_url的?sc=iThomeR外,還有m_url的/m

?sc=iThomeR一般稱作稱作查詢參數,其以{key}={value}的方式呈現,而/m則是路徑參數,不過在此則是以後端判斷的方式使其生成之前端頁面去抓取不同的css檔(排版標記檔)。

以下是兩者頁面所抓取的css的比較:

# d_url才有的:
"https://ithelp.ithome.com.tw/css/sweetalert.css" # Sweet Alert 警告框樣式
"https://ithelp.ithome.com.tw/css/google.css" # 沒用到 (只有一個選擇器)
"https://ithelp.ithome.com.tw/css/style.css" # 電腦版頁面樣式
"https://ithelp.ithome.com.tw/css/railscasts.css" # Markdown 標色樣式

# m_url才有的:
"https://ithelp.ithome.com.tw/mobile/css/animate.css" # 動畫樣式 (如:載入動畫)
"https://ithelp.ithome.com.tw/mobile/css/style.css" # 手機版頁面樣式

所以可以從上述的css檔案路徑中發現m_url的頁面所抓取的css皆置於mobile資料夾之下,所以可推得d_url與m_url的頁面,為非行動裝置板與行動裝置之區別。就像facebook的行動裝置頁面https://m.facebook.com一樣,其m參數皆是作為區分排版之用。

而在此d_url中的查詢參數所附加之內容只是提供後端做紀錄及追蹤之用。

希望有幫助到您=^w^=

看更多先前的回應...收起先前的回應...

超屌的解答 我喜歡你娓娓道來的方式說明
不囉嗦 直接給您最佳解答
讓其他疑惑的人也可以看到你用心地回答 太贊惹!!!

貓虎皮 iT邦新手 3 級 ‧ 2023-03-23 00:03:37 檢舉

萬分感謝,日後還請多指教

我自己改的,就自己改就好
https://ithelp.ithome.com.tw/upload/images/20230323/20097082cIUIwfyJ0m.jpg

大師好強 可以做成擴充套件或開源給大家膜拜!
跪了

不需要啊,只要會寫CSS 就能自己改啊
我用的只是瀏覽器的外掛而已,SYSTYLEBOT
https://chrome.google.com/webstore/detail/stylebot/oiaejidbmkiecgbjeifoejpgmdaleoha
自己裝好之後
進入 IT邦
打開他,輸入以下CSS 之後就跟我一樣了

.header > div,
.rightside .sidebox:nth-child(2),
.rightside .sidebox:nth-child(4) img,
.rightside .sidebox:nth-child(7),
.rightside .sidebox:nth-child(8),
.a970,.a810
{display: none;}
*{font-size: 20px; width: content;line-height: 1.5em;}
.qa-list__content {
    margin-left: 12em;
}
.menu__container {
    max-width: 100%;
    line-height: 1.5em;
    padding: 10PX;
}
.menu__item-link{
    padding: 5px 10px;
    height: 2EM;
}
.rightside{display:none}
.leftside{width:95%;float:right;}

還有我有裝 Midnight Lizard 這各 夜間模式外掛,所以頁面底是黑的
https://chrome.google.com/webstore/detail/midnight-lizard/pbnndmlekkboofhnbonilimejonapojg

大概就這樣
不好意思借這一層發一些心得

這值得發文給大家學,大大真的很猛!
希望我長大也這麼厲害,好感動這麼大方地分享٩(◦`꒳´◦)۶

我要發表回答

立即登入回答