Difference between revisions of "Template:TCU Taiwan/Notebook/CSS"
(20 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
.CollapsiblePanel { | .CollapsiblePanel { | ||
margin: 0px; | margin: 0px; | ||
Line 36: | Line 18: | ||
.CollapsiblePanelTab { | .CollapsiblePanelTab { | ||
font: bold 0.7em sans-serif; | font: bold 0.7em sans-serif; | ||
− | background-color: # | + | background-color:#000;/*背景色*/ |
border-bottom: solid 1px #CCC; | border-bottom: solid 1px #CCC; | ||
margin: 0px; | margin: 0px; | ||
Line 43: | Line 25: | ||
-moz-user-select: none; | -moz-user-select: none; | ||
-khtml-user-select: none; | -khtml-user-select: none; | ||
− | color: # | + | color:#FFF;/*字*/ |
font-style: normal; | font-style: normal; | ||
text-transform: none; | text-transform: none; | ||
− | table-layout: | + | table-layout: auto; |
empty-cells: hide; | empty-cells: hide; | ||
} | } | ||
Line 72: | Line 54: | ||
*/ | */ | ||
.CollapsiblePanelTab a { | .CollapsiblePanelTab a { | ||
− | color: | + | color:#FFF; |
text-decoration: none; | text-decoration: none; | ||
} | } | ||
Line 81: | Line 63: | ||
*/ | */ | ||
.CollapsiblePanelOpen .CollapsiblePanelTab { | .CollapsiblePanelOpen .CollapsiblePanelTab { | ||
− | background-color: | + | background-color:rgba(0%,0%,0%,0.8);/* 打開後的變色*/ |
} | } | ||
Line 90: | Line 72: | ||
.CollapsiblePanelClosed .CollapsiblePanelTab { | .CollapsiblePanelClosed .CollapsiblePanelTab { | ||
− | /* background-color: # | + | /* background-color: #FF0000 */ |
} | } | ||
Line 98: | Line 80: | ||
*/ | */ | ||
.CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover { | .CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover { | ||
− | background-color: | + | background-color:rgba(0%,0%,0%,0.5);/*滑鼠移到位置而變色*/ |
} | } | ||
Line 106: | Line 88: | ||
*/ | */ | ||
.CollapsiblePanelFocused .CollapsiblePanelTab { | .CollapsiblePanelFocused .CollapsiblePanelTab { | ||
− | background-color: # | + | background-color: rgba(0%,0%,0%,0.8);/*點擊後變色*/ |
+ | } | ||
+ | #abgne-block-20120427, #abgne-block-20120427 li { | ||
+ | list-style: none; | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | #abgne-block-20120427 { | ||
+ | position: relative; | ||
+ | top: 100px; | ||
+ | left: 100px; | ||
+ | width: 650px; /* (圖片的寬度 + _margin) * 數量 - _margin */ | ||
+ | height: 100px; /* 圖片的高度 */ | ||
+ | } | ||
+ | #abgne-block-20120427 li { | ||
+ | position: absolute; | ||
+ | } | ||
+ | #abgne-block-20120427 li a img { | ||
+ | border: none; | ||
} | } |
Latest revision as of 12:27, 21 July 2015
.CollapsiblePanel { margin: 0px; padding: 0px; border-left: solid 1px #CCC; border-right: solid 1px #999; border-top: solid 1px #999; border-bottom: solid 1px #CCC; }
/* This is the selector for the CollapsiblePanelTab. This container houses
* the title for the panel. This is also the container that the user clicks * on to open or close the panel. * * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary * to make the widget function. You can use any class name you want to style an * CollapsiblePanel panel tab container. */
.CollapsiblePanelTab { font: bold 0.7em sans-serif; background-color:#000;/*背景色*/ border-bottom: solid 1px #CCC; margin: 0px; padding: 2px; cursor: pointer; -moz-user-select: none; -khtml-user-select: none; color:#FFF;/*字*/ font-style: normal; text-transform: none; table-layout: auto; empty-cells: hide; }
/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
* you should never put any padding on the content area element if you plan to * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate. * * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary * to make the widget function. You can use any class name you want to style a * CollapsiblePanel content container. */
.CollapsiblePanelContent { margin: 0px; padding: 0px; table-layout: fixed; empty-cells: hide; }
/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
* keyboard focus ring appears *inside* the tab instead of around the tab. * This is an example of how to make the text within the anchor tag look * like non-anchor (normal) text. */
.CollapsiblePanelTab a { color:#FFF; text-decoration: none; }
/* This is an example of how to change the appearance of the panel tab that is
* currently open. The class "CollapsiblePanelOpen" is programatically added and removed * from panels as the user clicks on the tabs within the CollapsiblePanel. */
.CollapsiblePanelOpen .CollapsiblePanelTab { background-color:rgba(0%,0%,0%,0.8);/* 打開後的變色*/ }
/* This is an example of how to change the appearance of the panel tab when the
* CollapsiblePanel is closed. The "CollapsiblePanelClosed" class is programatically added and removed * whenever the CollapsiblePanel is closed. */
.CollapsiblePanelClosed .CollapsiblePanelTab {
/* background-color: #FF0000 */
}
/* This is an example of how to change the appearance of the panel tab as the
* mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added * and removed from panel tab containers as the mouse enters and exits the tab container. */
.CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover { background-color:rgba(0%,0%,0%,0.5);/*滑鼠移到位置而變色*/ }
/* This is an example of how to change the appearance of all the panel tabs when the
* CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed * whenever the CollapsiblePanel gains or loses keyboard focus. */
.CollapsiblePanelFocused .CollapsiblePanelTab { background-color: rgba(0%,0%,0%,0.8);/*點擊後變色*/ }
- abgne-block-20120427, #abgne-block-20120427 li {
list-style: none; margin: 0; padding: 0; }
- abgne-block-20120427 {
position: relative; top: 100px; left: 100px; width: 650px; /* (圖片的寬度 + _margin) * 數量 - _margin */ height: 100px; /* 圖片的高度 */ }
- abgne-block-20120427 li {
position: absolute; }
- abgne-block-20120427 li a img {
border: none; }