SHARE
TWEET

Untitled

a guest Nov 1st, 2017 75 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @media all{ /* 通用設定 */
  2.     html { background: #1D1F21; color: #C5C8C6; opacity: 1 !important; } /* 基本網頁背景樣式 */
  3.     body { font-size: 95%; font-family: arial,sans-serif; }
  4.     small { font-size: 0.8em; } /* 小字樣式(eg.[以預覽圖顯示]) */
  5.     hr { clear: left; } /* 分隔線樣式 */
  6.     img { border: 0; opacity: .8 !important; } /* 圖片顯示樣式,圖片透明度以背景色當亮度遮罩,避免夜間看圖過於刺眼 */
  7.     img:hover { opacity: .8 !important; } /* 圖片hover時顯示樣式 */
  8.     video { opacity: .8 !important; } /* webm影片顯示樣式,webm影片透明度以背景色當亮度遮罩,避免夜間看影片過於刺眼 */
  9.    
  10.     textarea { background-color: #CDCDCD; } /* 原css裡沒有的代碼,額外加上的 */
  11.     input { background-color: #CDCDCD; color: #000 } /* 原css裡沒有的代碼,額外加上的 */
  12.    
  13.     /* text-button: 文字連結樣式 */
  14.     a:link, .qlink, .text-button { color: #81A2BE; text-decoration: none; } /* 正常連結樣式 */
  15.     a:hover, .qlink:hover, .text-button:hover { color: #FFC685; cursor: pointer; } /* hover時連結樣式 */
  16.     a:visited { color: #81A2BE; } /* 已拜訪連結樣式 */
  17.  
  18.     #toplink { text-align: right; } /* 頁首連結條樣式 */
  19.     h1 { color: #C5C8C6; text-align: center; margin: 0 auto; } /* 網頁主標題樣式 */
  20.     hr.top { width: 90%; height: 1px; } /* 主標題下分隔線樣式 */
  21.  
  22.     .Form_bg { background: #000; } /* 送出表單左方欄位之底色 */
  23.     .hide_btn { float: right; width: 4em; height: 1.25em; overflow: hidden; text-align: center; background: #282A2E; } /* 表單收縮按鈕樣式 */
  24.     .show { color: #81A2BE; }
  25.     .hide { display: none; }
  26.     #postinfo { font-size: 0.8em; } /* 上傳說明樣式 */
  27.     form { padding: 0; margin: 0; } /* 修正表單標籤造成的排版問題 */
  28.  
  29.     /* posts */
  30.     #contents { width: 100%; }
  31.     .threadpost {  } /* 討論串首篇樣式 */
  32.     .post { max-width: 100%; }
  33.     .reply { display: table; margin: 0.3em 1em 0 1em; padding: 0.2em 0.5em 0.2em 0.5em; background: #282A2E; } /* 討論串回應樣式 */
  34.     .replywrap { display: table-cell; } /* 解決 IE8+ 無法選取討論串回應內文用 */
  35.     .post:target { background: #181818; }  /* 討論串回應背景標亮樣式 */
  36.    
  37.     .file-text { font-size: 0.8em; margin-left: 0.5em; margin-right: 0.5em; margin-top: 0.5em; } /* post file */
  38.    
  39.     /* post head */
  40.     .post-head { font-size: 0.9em; width: 100%; margin-top: 0.2em; margin-right: 0.5em; line-height: 1.7em; overflow-wrap : break-word; }
  41.     .post-head span { margin-left: 0.3em; }
  42.     .post-head span:not(.qlink):not(.rlink) { cursor: pointer; } /* ID, 標題, 名稱... */
  43.     .name { color: #EE88BC; font-weight: bold; word-break: break-all; } /* 文章張貼者名稱樣式 */
  44.     .admin_cap { color: #F0BEBE; } /* 管理員キャップ樣式設定 */
  45.     .img { float: left; margin: 1ex 2ex; } /* 討論串圖片顯示樣式 */
  46.     .title { color: #B294BB; font-size: 1.125em; font-weight: bold; } /* 討論串標題樣式 */
  47.     .nor { font-weight: normal; } /* Trip取消粗體用 */
  48.     .quote { margin: 0.9em 1em 1em 1.8em; display: block; word-break: break-all; } /* 討論串內文縮排樣式 */
  49.     .quote pre { display: block; max-height:450px; max-width:500px; overflow:auto; } /* code show */
  50.     .resquote { color: #ADBD68; } /* 標註引用回文顏色 */
  51.     .category { font-size: 0.8em; color: gray; } /* 類別標籤顯示樣式 */
  52.     .backquote { font-size: 0.8em; margin-top: 1em; word-break: break-all; }
  53.     .backquote .qlink { display: inline-block; margin-left: 0.5em; }
  54.  
  55.     .warn_txt { color: #DD3333; font-weight: bold; } /* 討論串狀態警告文字(eg.文章即將被刪除) */
  56.     .warn_txt2 { color: #8F8F8F; } /* 討論串狀態提示文字(eg.回應幾篇被隱藏) */
  57.     #footer { text-align: center; clear: both; } /* 頁尾樣式 */
  58.     .bar_reply { background: #4F535C; color: #DDDDDD; font-weight: bold; text-align: center; } /* 回應模式樣式標題列 */
  59.     .bar_admin { background: #EE8888; color: #000; font-weight: bold; text-align: center; } /* 管理模式樣式標題列 */
  60.     .ListRow1_bg { background: #282A2E; } /* 管理模式欄位背景顏色1(輪替出現) */
  61.     .ListRow2_bg { background: #181818; } /* 管理模式欄位背景顏色2(輪替出現) */
  62.    
  63.     /* id 顏色 by level */
  64.     /* .id3, .id5, .id8, .id9 { font-weight: bold; } */
  65.     .id3 { color: rgba(255,255,21,0.8); }
  66.     .id5 { color: #75D41D; }
  67.     .id8 { color: #F2784F; }
  68.     .id9 { color: #98E; }
  69.    
  70.     /* popup */
  71.     .popup { position: fixed; border-radius: 3px; overflow: auto; background: #282A2E; }
  72.     .popup .post { border-bottom: 0.05em solid rgba(0,0,0,0.75); display: block; }
  73.     .popup .img { float: none; max-width: 125px !important; max-height: 125px; }
  74.     .popup .file-text { display: none; }
  75.     .popup .warn_txt2 { display: none; }
  76.    
  77.     /* quickreply */
  78.     #quickreply { z-index: 20; position: fixed; background: #282A2E; display: none; }
  79.     #quickreply div { width: 100%; }
  80.     #quickreply .quickreply-head { height: 1.5em; font-size: 1.1em; cursor: move; font-weight: bold; text-align: center; }
  81.     #quickreply .quickreply-close { float: right; }
  82.    
  83.     #quickreply, .popup { box-shadow: 0 3px 10px rgba(0,0,0,0.75); border: 3px solid #666; }
  84. }
  85.  
  86. @media screen{ /* 標準顯示(一般顯示器)模式附加規則 */
  87.    
  88. }
  89.  
  90. @media handheld{ /* 手持設備(手機,PDA等)附加規則 */
  91.     html { max-width: 320px; margin: auto; } /* 320px為多數PDA的顯示寬度 */
  92.     input { max-width: 200px; }
  93.     textarea { max-width: 200px; height: 40px; }
  94.  
  95.     .img { margin: 0.5ex 0.5ex; max-width: 125px; } /* 討論串圖片顯示樣式 */
  96.     .reply { clear: left; margin: 0.5ex 0 0 0; } /* 討論串回應樣式 */
  97.     .quote { margin: 1ex 1ex; } /* 討論串內文縮排樣式 */
  98.     #page_switch { clear: right; } /* 避免頁尾表格交疊 */
  99. }
  100.  
  101. @media print{ /* 列印,預覽列印附加規則 */
  102.     html { background: #FFF; color: #000; } /* 網頁改成白底黑字,節省彩色列印成本 */
  103.     #postform_main { display: none; } /* 貼文表單在列印模式沒有用處,故不顯示以節省空間 */
  104. }
  105.  
  106. @media only screen and (min-device-width: 480px) {
  107.     /* popup, code show scroll bar */
  108.     pre::-webkit-scrollbar, div::-webkit-scrollbar { width: 0.5em; height: 0.5em; border: 1px solid #CCC; background-color: #DDD; }
  109.     pre::-webkit-scrollbar-thumb, div::-webkit-scrollbar-thumb { background-color: #999; }
  110. }
  111.  
  112. /* Android / iOS */
  113. @media only screen and (max-device-width: 480px) {
  114.     html { padding-top: 10px; } /* 頁面基本字體大小,邊界 */
  115.     body { font-size: 90%; margin: 0; }
  116.     #toplink { text-align: left; } /* 頂部連結列取消置右 */
  117.     #fcom { max-width: 35ex; } /* 調整表單欄位 */
  118.     #fupfile { display: block; }
  119.     input[type="text"] { max-width: 100% }
  120.     ul { padding-left: 2em; }
  121.     .img { margin: 0.5ex 0.5ex; max-width: 100%; height: auto; display: block; float: none; } /* 討論串圖片顯示樣式 */
  122.     /*.reply { clear: left; margin: 0.5ex 0 0 0; max-width: 100%; } */ /* 討論串回應樣式 */
  123.     .file-text { display: none; } /* 不顯示file text */
  124.     .pushpost { padding: 0.8em; }
  125.     #page_switch { clear: right; } /* 避免頁尾表格交疊 */
  126.    
  127.     .post { display: block; max-width: 100%; margin-left: 0.2em; margin-right: 0.2em; width: auto; }
  128.     .post-head { width:100%; word-wrap : break-word; overflow-wrap : break-word; }
  129.     .quote { margin: 5px 10px; overflow: auto; } /* 內文內縮 */
  130.     .quote pre { max-width: 300px; } /* code show */
  131. }
RAW Paste Data
Top