|
|
| (2人の利用者による、間の89版が非表示) |
| 1行目: |
1行目: |
| /* ここに記述したCSSはすべての外装に反映されます */
| |
|
| |
| /*-------------------------------------------------- | | /*-------------------------------------------------- |
| メインページのh1を非表示
| | ここに記述したCSSはすべての外装に反映されます |
| | モバイル用ページ用のCSSはMediaWiki:Mobile.cssで |
| | --------------------------------------------------*/ |
| | /*-------------------------------------------------- |
| | メインページ |
| --------------------------------------------------*/ | | --------------------------------------------------*/ |
| body.page-メインページ h1.firstHeading {display:none;} | | body.page-メインページ .firstHeading {display:none;} |
| body.page-メインページ #contentSub {display:none;} | | body.page-メインページ #contentSub {display:none;} |
|
| |
|
| /*-------------------------------------------------- | | /*-------------------------------------------------- |
| メインページの「案内」用 案１
| | 見出し |
| --------------------------------------------------*/ | | --------------------------------------------------*/ |
| .main_menu { position: relative; height:30px; width:300px;} | | .mw-body-content h2 |
| .main_menu a { text-decoration: none;}
| | { |
| .main_menu a:hover{ text-decoration: underline;} | | font-size:155%; |
| .main_menu a:link { color: #000; }/* リンク色 */
| | font-weight:bold; |
| .main_menu a:visited { color: #000; }/* すでに踏んだリンク色 */
| | border-bottom:medium double; |
| .main_menu:hover{background-image:url(http://ssbwiki.e3.valueserver.jp/wiki/images/3/39/案内_帯.png); background-repeat: no-repeat;}/* マウスオーバーで帯*/ | | } |
| .main_menu:hover a:link { color: #FFF; }/* マウスオーバー時のリンク色 */
| | .mw-body-content h3 |
| .main_menu:hover a:visited { color: #FFF; }/* マウスオーバー時のすでに踏んだリンク色 */
| | { |
| .main_menu_i { position: absolute; z-index: 0; left: 5px; top: 5px;}/* アイコンの位置 */ | | border-left:6px solid #BABABA; |
| .main_menu_i_h { visibility: hidden; }/* マウスオーバー時に表示されるアイコンの初期状態 */ | | border-bottom: 2px solid #BABABA; |
| .main_menu:hover .main_menu_i_h{ visibility: visible; z-index: 1; }/* マウスオーバー時にデフォアイコンの上に重ねてマウスオーバー用のものを表示 */ | | } |
| .main_menu_m { font-size:25px; font-weight:bold; position: absolute; left: 40px; top: 8px;}/* テキスト */ | | .mw-body-content h4 |
| .main_menu_s { visibility: hidden; font-size:8px; position: absolute; left: 185px; top: 15px;}/* マウスオーバー時に表示されるテキスト */
| | { |
| .main_menu_s a { margin-right:0.4em;}/* マウスオーバー時に表示されるテキストの間隔 */ | | border-left:10px double #BABABA; |
| .main_menu:hover .main_menu_s{ visibility: visible;}/* マウスオーバー時に表示されるテキスト */ | | } |
| /* 大サイズ用 */
| | .mw-body-content h3, |
| .main_menu_b { position: relative; height:30px; width:300px;} | | .mw-body-content h4, |
| .main_menu_b a { text-decoration: none;} | | .mw-body-content h5, |
| .main_menu_b a:hover{ text-decoration: underline;}
| | .mw-body-content h6 |
| .main_menu_b a:link { color: #000; }/* リンク色 */ | | { |
| .main_menu_b a:visited { color: #000; }/* すでに踏んだリンク色 */
| | margin-top:1em; |
| .main_menu_b:hover{background-image:url(http://ssbwiki.e3.valueserver.jp/wiki/images/3/35/案内_帯_大.png); background-repeat: no-repeat;}/* マウスオーバーで帯*/ | | padding:0.05em 0.2em; |
| .main_menu_b:hover a:link { color: #FFF; }/* マウスオーバー時のリンク色 */
| | } |
| .main_menu_b:hover a:visited { color: #FFF; }/* マウスオーバー時のすでに踏んだリンク色 */
| | .mw-body-content h2, |
| .main_menu_b:hover .main_menu_i_h{ visibility: visible; z-index: 1; }/* マウスオーバー時にデフォアイコンの上に重ねてマウスオーバー用のものを表示 */ | | .mw-body-content h3, |
| .main_menu_s_b { visibility: hidden; font-size:8px; position: absolute; left: 217px; top: 15px;}/* マウスオーバー時に表示されるテキスト */
| | .mw-body-content h4 |
| .main_menu_s_b a { margin-right:0.4em;}/* マウスオーバー時に表示されるテキストの間隔 */
| | { |
| .main_menu_b:hover .main_menu_s_b{ visibility: visible;}/* マウスオーバー時に表示されるテキスト */
| | letter-spacing: 0.5em; |
| | | } |
| | .mw-body-content h4, |
| | .mw-body-content h5 |
| | { |
| | border-bottom: 1px solid #BABABA; |
| | } |
| | .mw-editsection |
| | { |
| | letter-spacing: normal; |
| | } |
| /*-------------------------------------------------- | | /*-------------------------------------------------- |
| メインページの「案内」用 案2
| | 本文スタイル |
| --------------------------------------------------*/ | | --------------------------------------------------*/ |
| .mainmenu { white-space:nowrap; border-collapse:collapse; margin:0 5px 10px 5px; box-shadow:1px 0.5px 1px 0px rgba(0,0,0,0.4); color:#FFF; float:left;}
| | li { |
| .mainmenu a { font-weight:bold;}
| | margin-bottom: 0.3em; |
| .mainmenu_t { height:55px; vertical-align:middle; font-size:23px; font-weight:bold; }/* 上 */
| |
| .mainmenu_b { height:55px; padding-left:10px; background-color:#333; text-align:left; vertical-align:middle; line-height:30px; font-size:10px; }/* 下 */ | |
| | |
| /* ウィンドウが601px以上 */
| |
| @media screen and (min-width: 601px) {
| |
| .mainmenu {margin:0 1% 10px 0;}
| |
| .mainmenu_l { width:394px; }/* 大サイズ */
| |
| .mainmenu_s { width:192px;}/* 大サイズ */
| |
| } | | } |
| /* ウィンドウが600px以下 */
| |
| @media screen and (max-width: 600px) {
| |
| .mainmenu {margin:0 1% 10px 0;}
| |
| .mainmenu_l { width:100%; }/* 大サイズ */
| |
| .mainmenu_s { width:49.2%;}/* 大サイズ */
| |
| }
| |
|
| |
| /*-------------------------------------------------- | | /*-------------------------------------------------- |
| リンク色変更 | | リンク色変更 |
| 80行目: |
76行目: |
|
| |
|
| /*-------------------------------------------------- | | /*-------------------------------------------------- |
| MenuSidebar
| | テーブルの奇数行に着色 表にclass="odd" |
| --------------------------------------------------*/ | | --------------------------------------------------*/ |
| /* this has to be overridden for every menu */
| | .odd tr:nth-child(2n-1) { |
| #p-Menu,
| | background: #dfdfdf none repeat scroll 0 0; |
| #p-Menu2, | | text-shadow: 0 1px 0 #fff; |
| #p-Menu3 {
| |
| overflow: visible;
| |
| } | | } |
|
| | .odd tr:nth-child(2n) { |
| /* this has to be overridden for every menu */
| | background: #fff; |
| #p-Menu div,
| |
| #p-Menu2 div,
| |
| #p-Menu3 div {
| |
| margin: 0; | |
| padding: 0;
| |
| } | | } |
|
| | |
| /* this is an example to make the list of the second entry bigger e.g. when ther is a longer text in a list item | | /*-------------------------------------------------- |
| #p-Menu ul li.item2 ul {
| | キャラセレ風表 |
| width: 16em; | | --------------------------------------------------*/ |
| | .char_table { |
| | max-width:890px; |
| | margin:5px auto 5px; |
| } | | } |
| */
| | |
| | | .char_table > div { |
| /* this an example to change the background color of every second list item
| | display:inline-block; |
| li.even {
| | width:60px; |
| background-color: #eeeeee; | | letter-spacing:-0.5px; |
| | font-size:0.7em; |
| | white-space: nowrap; |
| | text-align:center; |
| | border:1px #333 solid; |
| | -webkit-box-sizing: content-box; |
| | -moz-box-sizing: content-box; |
| | box-sizing: content-box; |
| } | | } |
| */
| | .char_table > .comp { |
|
| | letter-spacing:-1.3px; |
| .menuSidebar ul { /* remove bullets and list indents */ | |
| list-style: none; | |
| margin: 0;
| |
| padding: 0;
| |
| } | | } |
|
| | |
| /* this div is only for better handling and navigation ... could also be done in inner ul*/ | | /*-------------------------------------------------- |
| .menuSidebar ul div {
| | その他 |
| position: absolute;
| | --------------------------------------------------*/ |
| top: -6px;
| | #mw-panel .portal{ |
| left: 100%; /* to position them to the right of their containing block */
| | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIwAAAABCAAAAAAphRnkAAAAJ0lEQVQIW7XFsQEAIAyAMPD/b7uLWz8wS5youFW1UREfiIpH1Q2VBz7fGPS1dOGeAAAAAElFTkSuQmCC); |
| width: 100%; /* width is based on the containing block */
| | background-repeat: no-repeat; |
| z-index: 100; /* show ul on top */
| |
| }
| |
|
| |
| .menuSidebar ul ul {
| |
| background-color: white;
| |
| border: 1px solid #aaaaaa;
| |
| margin-top: 5px; /* make navigation easier*/
| |
| margin-bottom: 5px; /* make navigation easier*/
| |
| z-index: 101; /* show on top; Needed for IE 7 */
| |
| width: 12em; /* width of inner menu, Needed for IE 7 */
| |
| }
| |
|
| |
| .menuSidebar li { | |
| position: relative; /* make li a container for inner elements */
| |
| margin: 1px;
| |
| z-index: 102; /* show on top; Needed for IE 7 */
| |
| }
| |
|
| |
| /* style, color and size links and headings to suit */
| |
| .menuSidebar a {
| |
| display: block;
| |
| border-width: 0px 0px 1px 0px;
| |
| margin: 0px;
| |
| padding: 1px;
| |
| padding-left: 5px;
| |
| text-decoration: none;
| |
| } | | } |
|
| | .nodesktop{ |
| /* move the > to the right */
| | display:none; |
| .menuSidebar a em { | |
| position: absolute;
| |
| right: 4px;
| |
| } | | } |
|
| | .clearfix:after{ |
| .menuSidebar li:hover, /* Needed for IE 7 */
| | content: ""; |
| .menuSidebar a:hover {
| | clear: both; |
| background: #ccccff;
| | display: block; |
| } | | } |
|
| |
| .menuSidebar li.separator a:hover {
| |
| background: white;
| |
| }
| |
|
| |
| /* Needed for IE 7 */
| |
| .menuSidebar li.separator a,
| |
| .menuSidebar li.separator {
| |
| line-height: 0px;
| |
| height: 0px;
| |
| font-size: 0px;
| |
| }
| |
|
| |
| .menuSidebar ul li:last-Child a {
| |
| border-width: 0px 0px 0px 0px; // remove the last bottom line
| |
| padding-bottom: 0px;
| |
| }
| |
|
| |
| /* hides the first level */
| |
| .menuSidebar ul li div { display: none; }
| |
|
| |
| /* shows the first level and hide the second */
| |
| .menuSidebar ul li:hover div,
| |
| .menuSidebar ul li div:hover { display: block; } /* div is again used for easier navigation*/
| |
| .menuSidebar ul li:hover ul li div { display: none; } /* hide the next level */
| |
|
| |
| /* second level*/
| |
| .menuSidebar ul li ul li:hover div,
| |
| .menuSidebar ul li ul li div:hover { display: block; } /* div is again used for easier navigation*/
| |
| .menuSidebar ul li ul li:hover ul li div { display: none; } /* hide the next level */
| |
| .menuSidebar ul ul { font-size: 120%; }
| |
|
| |
|
| |
| /* third level */
| |
| .menuSidebar ul li ul li ul li:hover div,
| |
| .menuSidebar ul li ul li ul li div:hover { display: block; } /* div is again used for easier navigation*/
| |
| .menuSidebar ul li ul li ul li:hover ul li div { display: none; } /* hide the next level */
| |