MediaWiki:Common.css: различия между версиями
Строка 113: | Строка 113: | ||
width:100%; | width:100%; | ||
z-index:10; | z-index:10; | ||
− | text-align: | + | text-align:middle; |
vertical-align:middle; /* для отображения подпунктов поверх остальных блоков */ | vertical-align:middle; /* для отображения подпунктов поверх остальных блоков */ | ||
} | } |
Версия 10:31, 14 октября 2013
/* CSS @Invisible_man*/ table.collapsed tr.collapsible { display: none; } .collapseButton { cursor: pointer; } h1 { /* Заголовок 1 */ color: #8D673A; /*Цвет*/ text-shadow: 0 0 5px #CDAA80, 0 0 10px #CDAA80, 0 0 20px #CDAA80, 0 0 30px #CDAA80, 0 0 40px #CDAA80; /* Расплывающаяся тень */ } h2 { color: #8D673A; text-shadow: 0 0 2px #CDAA80, 0 0 5px #CDAA80, 0 0 10px #CDAA80, 0 0 15px #CDAA80, 0 0 20px #CDAA80; } h3 { color: #8D673A; text-shadow: 0 0 1px #CDAA80, 0 0 2px #CDAA80, 0 0 5px #CDAA80, 0 0 7px #CDAA80, 0 0 10px #CDAA80; } h4 { color: #8D673A; text-shadow: 0 0 1px #CDAA80, 0 0 1px #CDAA80, 0 0 2px #CDAA80, 0 0 3px #CDAA80, 0 0 5px #CDAA80; } h5 { color: #8D673A; text-shadow: 0 0 1px #CDAA80, 0 0 1px #CDAA80, 0 0 1px #CDAA80, 0 0 2px #CDAA80, 0 0 3px #CDAA80; } /* Верхрнее меню */ .addthis_toolbox { position: fixed; /*Фиксированно на экране*/ z-index: 1000; /*Окошко всегда будет на переднем плане*/ top: 2px; /*Отступы*/ left: 15%; padding: 5px; width: 600px; height: 90px; opacity: 0.8; /*Прозрачность*/ filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80); /*IE 5.5+*/ -moz-opacity: 0.8; /* Mozilla 1.6 и ниже */ html-opacity: 0.8; /* Konqueror 3.1, Safari 1.1 */ background-image: url(https://wiki.botva.ru/images/4/43/Fon_2.png); /*Фон*/ background-position: 0px 0px; background-size: 600px; background-repeat: no-repeat; } .addthis_toolbox .custom_images a { width: 32px; height: 32px; cursor: pointer; } .addthis_toolbox .custom_images a img { border: 0; margin: 2px 0; opacity: 0.6; } .addthis_toolbox .custom_images a:hover img { margin: 2px 0; opacity: 1.0; } /*Меню*/ /*************************** Основные пункты */ #mainmenu{ position:relative; border: 1px solid #222; background-color: #111; background-image: -moz-linear-gradient(#444, #111); background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111)); background-image: -webkit-linear-gradient(#444, #111); background-image: -o-linear-gradient(#444, #111); background-image: -ms-linear-gradient(#444, #111); background-image: linear-gradient(#444, #111); border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -webkit-border-radius: 6px; -ms-border-radius: 6px; box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; -moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; -o-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; -ms-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; -webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset; height:40px; margin:50px auto; padding:0; width:100%; z-index:10; text-align:middle; vertical-align:middle; /* для отображения подпунктов поверх остальных блоков */ } #mainmenu ul, /* сбрасываем поля и отступы у списков */ #mainmenu ul ul { list-style:none; padding:0; margin:0; } #mainmenu ul { clear:left; position:relative; right:50%; height:40px; float:right; text-align:center; font:12px Arial, Helvetica, sans-serif; text-align:center; } #mainmenu ul li { border-right: 1px solid #222; box-shadow: 1px 0 0 #444; -moz-box-shadow: 1px 0 0 #444; -o-box-shadow: 1px 0 0 #444; -ms-box-shadow: 1px 0 0 #444; -webkit-box-shadow: 1px 0 0 #444; position:relative; left:50%; float:left; height:40px; padding:0; margin:0; } #mainmenu ul li:last-child { border:none; box-shadow:none; } #mainmenu ul li a { display:block; color: #ccc; text-decoration: none; padding:13px 20px; } #mainmenu ul li a:hover { background-color: #0186BA; background-image: -moz-linear-gradient(#04acec, #0186ba); background-image: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba)); background-image: -webkit-linear-gradient(#04acec, #0186ba); background-image: -o-linear-gradient(#04acec, #0186ba); background-image: -ms-linear-gradient(#04acec, #0186ba); background-image: linear-gradient(#04acec, #0186ba); color: #fafafa; } #mainmenu ul li:hover > ul { opacity: 1; visibility: visible; margin: 0; } /*************************** Выпадающие подпункты */ #mainmenu ul li ul { background: #444; background: -moz-linear-gradient(#444, #111); background-image: -webkit-gradient(linear, left top, left bottom, from(#444), to(#111)); background: -webkit-linear-gradient(#444, #111); background: -o-linear-gradient(#444, #111); background: -ms-linear-gradient(#444, #111); background: linear-gradient(#444, #111); border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; -webkit-border-radius: 3px; transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; text-transform:none; opacity: 0; visibility: hidden; position:absolute; left:0; top:40px; font-size:12px; height:auto; width:150px; } #mainmenu ul li ul li { border:none; box-shadow: 0 1px 0 #111, 0 2px 0 #666; -moz-box-shadow: 0 1px 0 #111, 0 2px 0 #666; -o-box-shadow: 0 1px 0 #111, 0 2px 0 #666; -webkit-box-shadow: 0 1px 0 #111, 0 2px 0 #666; -ms-box-shadow: 0 1px 0 #111, 0 2px 0 #666; position:relative; left:0; float:none; height:auto; margin:0; text-align:left !important; } #mainmenu ul li ul li:last-child { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #mainmenu ul li ul li a { padding:10px 8px; border:none; } /*************************** Выпадающие пункты второго уровня */ #mainmenu ul li ul li ul { top: 0; left: 150px; margin: 0 0 0 20px; _margin: 0; /*IE6 only*/ box-shadow: -1px 0 0 rgba(255,255,255,.3); -moz-box-shadow: -1px 0 0 rgba(255,255,255,.3); -o-box-shadow: -1px 0 0 rgba(255,255,255,.3); -ms-box-shadow: -1px 0 0 rgba(255,255,255,.3); -webkit-box-shadow: -1px 0 0 rgba(255,255,255,.3); } /*********************** Стрелочки на подпунктах */ #mainmenu ul ul li:first-child > a { border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; -o-border-radius: 3px 3px 0 0; -ms-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; } #mainmenu ul ul li:first-child > a:after { content: ''; position: absolute; left: 40px; top: -6px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #444; } #mainmenu ul ul ul li:first-child a:after { left: -6px; top: 50%; margin-top: -6px; border-left: 0; border-bottom: 6px solid transparent; border-top: 6px solid transparent; border-right: 6px solid #3b3b3b; } #mainmenu ul ul li:first-child a:hover:after { border-bottom-color: #04acec; } #mainmenu ul ul ul li:first-child a:hover:after { border-right-color: #0299d3; border-bottom-color: transparent; } #mainmenu ul ul li:last-child > a { -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; }