|
|
|
| помогите пожалуйста!!!
вот у меня меню. css. хочу сделать так как видел где то не помню где но очень распространённо. около каждого пункта стоит жирная точка такая. кружочек. при наведение мышкой на пуект он меняет звет но не так же как пункт! как это делаеться??? подскажите пожалуйста! я не то что не знаю как сделать так чтоб он менял цвет отдельно от пункта яч незнаю даже как написать такой крудочек! это не картинка. он пишеться как то!
<style>
<!--
body {margin-left:0; margin-right:0; margin-top:0; margin-bottom:0;}
-->
#menu_cont ul {
font-size: 0.85em;
margin: 0;
padding: 0;
list-style: none;
}
#menu_cont li {
display: inline;
float: top;
}
#menu_cont li a {
display: block;
padding: 7px 20px;
color: #003388;
background-color: #f5f5f5;
margin-right: 2px; width:100px; text-decoration:none;
}
#menu_cont li a:hover {
display: block;
padding: 7px 20px;
color: #333;
background-color: #fff;
margin-right: 2px; text-decoration:none;
}
#menu_cont li span {
display: block;
padding: 6px 20px;
color: #555;
background-color: #e8e8e8;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
margin-right: 2px;
}
</style>
</head>
<body marginheight="0" marginwidth="0" background="site1_21FONDO.jpg">
<div id="menu_cont">
<ul>
<li><a href="#"><font size="+6">.</font>Пункт меню 1</a></li>
<li><a href="#">o Пункт меню 2</a></li>
<li><a href="#">o Пункт меню 3</a></li>
<li><a href="#">o Пункт меню 3</a></li>
</ul>
</div>
|
плиииз! от этого может зависить будущее всей нашей планеты!!! | |
|
|
|
|
|
|
|
для: divirtir
(19.06.2006 в 20:33)
| | Знаю только как эти кружочки рисуются
(кстати они по дефолту в списках присутствуют)
<ul type="disc">
<li>1
<li>2
</ul>
<ul type="circle">
<li>1
<li>2
</ul>
<ul type="square">
<li>1
<li>2
</ul> | |
|
|
|
|
|
|
|
для: RMW
(19.06.2006 в 21:45)
| | нда! спасибо большре!!! хотя незнаю радоваться или не очень. у меня же это меня написано на этих самых li и на тех самых lu так что они вовсе не отображаються! может взять попробывать заменить Li и Lu ну например на tr и td ? это сработает как вы думаете? а то мне бесполезно втыкать сейчас в это меня эти нехорошие li - lu! :( | |
|
|
|
|
|
|
|
для: divirtir
(19.06.2006 в 22:21)
| | Ну, не знаю не знаю.
Я вот чуть изменил...
Правда в IE цвет не меняется, он hover только для ссылок поддерживает.
<html>
<head>
<style>
<!--
body {margin-left:0; margin-right:0; margin-top:0; margin-bottom:0;}
-->
#menu_cont li:hover {
color:green;
}
#menu_cont ul {
color:red;
font-size: 0.85em;
margin: 0;
padding: 0;
list-style: disc;
}
#menu_cont li {
/*display: inline;*/
float: top;
}
#menu_cont li a {
display: block;
padding: 7px 20px;
color: #003388;
background-color: #f5f5f5;
margin-right: 2px; width:100px; text-decoration:none;
}
#menu_cont li a:hover {
display: block;
padding: 7px 20px;
color: #333;
background-color: #fff;
margin-right: 2px; text-decoration:none;
}
#menu_cont li span {
display: block;
padding: 6px 20px;
color: #555;
background-color: #e8e8e8;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
margin-right: 2px;
}
</style>
</head>
<body marginheight="0" marginwidth="0" background="site1_21FONDO.jpg">
<div id="menu_cont">
<ul>
<li><a href="#">Пункт меню 1</a></li>
<li><a href="#">Пункт меню 2</a></li>
<li><a href="#">Пункт меню 3</a></li>
</ul>
</div>
</body>
</html>
|
| |
|
|
|
|
|
|
|
для: RMW
(19.06.2006 в 22:46)
| | уууф! как хорошо вы придумали! жалко что в ie не фурычит! а скрипит у меня был для того чтоб смотреть в ie но не работает :( я в них тож не понимаю. наверно это не для этого! как его переделать чтоб работал?
<script type="text/javascript"><!--//--><![CDATA[//><!--
jsHover = function() {
var hEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0, len=hEls.length; i<len; i++) {
hEls[i].onmouseover=function() { this.className+=" jshover"; }
hEls[i].onmouseout=function() { this.className=this.className.replace(" jshover", ""); }
}
}
if (window.attachEvent && navigator.userAgent.indexOf("Opera")==-1) window.attachEvent("onload", jsHover);
//--><!]]></script>
|
| |
|
|
|
|
|
|
|
для: divirtir
(19.06.2006 в 23:05)
| | В скрипте нужно заменить "nav" на "menu_cont"
Потом дополнить
#menu_cont li:hover, li.jshover {
color:green;
}
Со всякими марджинами и пэддингами сам разбирайся.
_
Короче для IE, чтобы кружочки
как бы появились нужно
margin: 10;
padding: 10;
При этом меню сдвигается. | |
|
|
|
|
|
|
|
для: RMW
(20.06.2006 в 01:07)
| | ВАААУ! не ужель получиться! я уже 16 часов голову ломаю об эти падинги! ты мне обясни тока плиз эти маргин падинг 10 куда ставить то? в li ?? или в скрипит? :() тоесть маргин 10 писать для кружочков?? и шариков :)) | |
|
|
|
|
|
|
|
для: divirtir
(20.06.2006 в 04:03)
| | особо не вдоваясь в детали, думаю что кружечки проще нарисовать самому.
http://alvit.de/css-showcase/css-navigation-techniques-showcase.php - выбирайте понравившееся и сохраняйте страницу, стили расположены в нейже.
ваш случай примерно этот http://e-lusion.com/design/menu/ | |
|
|
|
|
|
|
|
для: AlexSol
(20.06.2006 в 09:36)
| | во круто! спасибо большое! всё сделал всё забацал отлисно! спасииибо! :)
просто рисунки переделал под свои и стили поменял как надо! | |
|
|
|
|
|
|
|
для: divirtir
(20.06.2006 в 04:03)
| | Бли-и-ин :)))
<html>
<head>
<script type="text/javascript"><!--//--><![CDATA[//><!--
jsHover = function() {
var hEls = document.getElementById("menu_cont").getElementsByTagName("LI");
for (var i=0, len=hEls.length; i<len; i++) {
hEls[i].onmouseover=function() { this.className+=" jshover"; }
hEls[i].onmouseout=function() { this.className=this.className.replace(" jshover", ""); }
}
}
if (window.attachEvent && navigator.userAgent.indexOf("Opera")==-1) window.attachEvent("onload", jsHover);
//--><!]]></script>
<style>
<!--
body {margin-left:0; margin-right:0; margin-top:0; margin-bottom:0;}
-->
#menu_cont li:hover, li.jshover {
color:green;
}
#menu_cont ul {
color:red;
font-size: 0.85em;
margin: 10;
padding: 10;
list-style: disc;
}
#menu_cont li {
/*display: inline;*/
float: top;
}
#menu_cont li a {
display: block;
padding: 7px 20px;
color: #003388;
background-color: #f5f5f5;
margin-right: 2px; width:100px; text-decoration:none;
}
#menu_cont li a:hover {
display: block;
padding: 7px 20px;
color: #333;
background-color: #fff;
margin-right: 2px; text-decoration:none;
}
#menu_cont li span {
display: block;
padding: 6px 20px;
color: #555;
background-color: #e8e8e8;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
margin-right: 2px;
}
</style>
</head>
<body marginheight="0" marginwidth="0" background="site1_21FONDO.jpg">
<div id="menu_cont">
<ul>
<li><a href="#">Пункт меню 1</a></li>
<li><a href="#">Пункт меню 2</a></li>
<li><a href="#">Пункт меню 3</a></li>
</ul>
</div>
</body>
</html>
|
| |
|
|
|
|
|
|
|
для: RMW
(20.06.2006 в 12:32)
| | какой всё таки нород тут хорошый! заботливый! спасибо всем!!! у меня теперь по поводу отображения в браузерах вопрос. меня смотриться хорошо в ie и opera а вот в мазила косит!
пункты - рисунками сделанные но дело не в рисунках! в коде что то! рисунки пунктов - ссылок смещенны вправо. некрасиво. отстув наверное в 40 px от положенного! что делать? вот страница
http://www.dntkv.com/dextra/PADEXTRA9.html
помогите пожалуйста. почему не хочет правельно показывать мозила? плииз! | |
|
|
|
|
|
|
|
для: divirtir
(21.06.2006 в 04:50)
| | да, и ещё в FF точек нету ... или может их не видно? | |
|
|
|
|
|
|
|
для: Oligarx
(21.06.2006 в 08:22)
| | точки вроде есть! с точками всё нормально! они расположены с правой части рисунка пункта. а пункты смещены не с лева а с права. поэтому точки тоже в право перетащились. вот. но у меня покрайней мере точки есть. моет FF разнве у нас какие нить. | |
|
|
|
|
|
|
|
для: divirtir
(21.06.2006 в 10:37)
| | FF версия 1.5.0.4 | |
|
|
|