ReSQL.ru
     
powered by simpleCommunicator - 2.0.60     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / Программирование [игнор отключен] [закрыт для гостей] / проблема с css
6 сообщений из 6, страница 1 из 1
проблема с css
    #33283860
imp1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
imp1
Участник
Проблема в том, что написал всплывающую менюху, вернее взял готовую чуток поменял.
А вот изменить css не получается, потому когда ставлю новые стили задеваются старые. помогите написать свои классы
вот код css:
UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 180px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}

UL LI {
POSITION: relative
}
LI UL {
DISPLAY: none; LEFT: -187px; POSITION: absolute; TOP: 0px
}

.UL_LI_A {
BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 0px solid; TEXT-DECORATION: none
}

.UL_LI_A_END {
BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 1px solid; TEXT-DECORATION: none
}

HTML UL LI {
FLOAT: left; HEIGHT: 1%
}
HTML UL LI A {
HEIGHT: 1%
}
LI:hover UL {
DISPLAY: block
}
LI.over UL {
DISPLAY: block
}

а вот код html

<A href="#" class=sub_menu> Конкурсы, викторины</A>

<UL>
<LI ><A class="UL_LI_A"
href="#">111 <IMG height=1 alt=xxx.gif src="" width=160 border=0 align="middle"></A>
</LI>

<LI><A class="UL_LI_A"
href="#">Миниконкурсы по информатике<IMG height=1 alt=xxx.gif src="" width=160 border=0 align="middle"></A>
</LI>
<LI><A class="UL_LI_A"
href="#">222<IMG height=1 alt=xxx.gif src="" width=160 border=0 align="middle"></A>
</LI>

<LI><A class="UL_LI_A"
href="#">333<IMG height=1 alt=xxx.gif src="" width=160 border=0></A>
</LI>

<LI><A class="UL_LI_A"
href="#">444<IMG height=1 alt=xxx.gif src="" width=160 border=0 align="middle"></A>
</LI>


<LI><A class="UL_LI_A_END"
href="#">Дети и сети<IMG height=1 alt=xxx.gif src="" width=160 border=0 align="middle"></A>
</LI>
</UL></LI>
</ul>

просто другие ul li становятся на сайте корявыми, потому требуется локализация при помощи классов. Заранее спасибо :-)
...
Рейтинг: 0 / 0
22.09.2005, 14:48
| Ответить | Цитировать | Написать  
проблема с css
    #33284138
хм...
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
хм...
Участник
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style>

.menu UL {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 180px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none
}

.menu UL LI {
POSITION: relative
}
.menu LI UL {
DISPLAY: none; LEFT: -187px; POSITION: absolute; TOP: 0px
}

.UL_LI_A {
BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 0px solid; TEXT-DECORATION: none
}

.UL_LI_A_END {
BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 1px solid; TEXT-DECORATION: none
}

HTML .menu UL LI {
FLOAT: left; HEIGHT:  1 %
}
HTML .menu UL LI A {
HEIGHT:  1 %
}
.menu LI:hover UL {
DISPLAY: block
}
.menu LI.over UL {
DISPLAY: block
}

</style>
</head>
<body style="margin:10px">

<ul>
<li>aaaaaaaaaaaa
	<ul>
	<li>aaaaaaaaaaaa</li>
	<li>sssssssssssssss</li>
	<li>ddddddddddddddddddd</li>
	<li>ffffffffffffffff</li>
	</ul>
</li>
<li>sssssssssssssss</li>
<li>ddddddddddddddddddd</li>
<li>ffffffffffffffff</li>
</ul>

<br>

<span class='menu'>
<A href="#" class=sub_menu> Конкурсы, викторины</A> 

<UL>
<LI ><A class="UL_LI_A" 
href="#"> 111  <IMG height= 1  alt=xxx.gif src="" width= 160  border= 0  align="middle"></A> 
</LI>

<LI><A class="UL_LI_A" 
href="#">Миниконкурсы по информатике<IMG height= 1  alt=xxx.gif src="" width= 160  border= 0  align="middle"></A> 
</LI>
<LI><A class="UL_LI_A" 
href="#"> 222 <IMG height= 1  alt=xxx.gif src="" width= 160  border= 0  align="middle"></A> 
</LI>

<LI><A class="UL_LI_A" 
href="#"> 333 <IMG height= 1  alt=xxx.gif src="" width= 160  border= 0 ></A> 
</LI>

<LI><A class="UL_LI_A" 
href="#"> 444 <IMG height= 1  alt=xxx.gif src="" width= 160  border= 0  align="middle"></A> 
</LI>


<LI><A class="UL_LI_A_END"
href="#">Дети и сети<IMG height= 1  alt=xxx.gif src="" width= 160  border= 0  align="middle"></A> 
</LI>
</ul>

</span>
</body>
</html>
...
Рейтинг: 0 / 0
22.09.2005, 16:04
| Ответить | Цитировать | Написать  
проблема с css
    #33285511
imp1
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
imp1
Участник
каюсь, корявый код написал с всплывающим меню, что теперь и сам не могу разобраться.
Вот нормальный код, где следует прописать классы, граждане, помогите, ну пожалуйста. Для удобство и css и скрипт скинул в один файл, что вы могли легко сами потестить.
--------------------------------------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html><head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style>
A.sub_menu {MARGIN-TOP: 5px; FONT-WEIGHT: bold; FONT-SIZE: 13px; MARGIN-BOTTOM: 5px; MARGIN-LEFT: 5px; COLOR: #0049c1; FONT-FAMILY: tahoma, verdana, sans-serif; HEIGHT: 16px; TEXT-DECORATION: none}
A.sub_menu:hover {MARGIN-TOP: 5px; FONT-WEIGHT: bold; FONT-SIZE: 13px; MARGIN-BOTTOM: 5px; MARGIN-LEFT: 5px; COLOR: #0291ff; FONT-FAMILY: tahoma, verdana, sans-serif; HEIGHT: 16px; TEXT-DECORATION: none}


UL {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 180px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none}
UL LI {POSITION: relative}
LI UL {DISPLAY: none; LEFT: -187px; POSITION: absolute; TOP: 0px}

.UL_LI_A {BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 0px solid; TEXT-DECORATION: none}
.UL_LI_A_END {BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 1px solid; TEXT-DECORATION: none}

HTML UL LI {FLOAT: left; HEIGHT: 1%}
HTML UL LI A {HEIGHT: 1%}
LI:hover UL {DISPLAY: block}
LI.over UL {DISPLAY: block}

</style>
<!-- <SCRIPT src="drop_down.js"
type=text/javascript></SCRIPT> -->
<script language="javascript">
startList = function() {
if (document.all&&document.getElementById) {



navRoot = document.getElementById("nav");
for (i=0; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes ;
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
}
node.onmouseout=function() {
this.className=this.className.replace(" over", "");
}
}
}



}
}
window.onload=startList;
</script>
</head>
<body style="margin:10px">
<ul>
<li>Один
<ul>
<li>один</li>
<li>два</li>
<li>три</li>
<li>четыре</li>
</ul>
</li>
<li>два</li>
<li>три</li>
<li>четыре</li>
</ul>

<br>
<table align="left">
<tr><td width="200"></td>
<td>
<UL id=nav>

<LI>

<A href="#" class=sub_menu>Один</A>
<UL>
<LI><A class="UL_LI_A"
href="#">Один</A>
</LI>
<LI><A class="UL_LI_A_END"
href="#">два</A>
</LI>
</UL></LI>
</ul>
</td></tr></table>
</body></html>
...
Рейтинг: 0 / 0
23.09.2005, 11:34
| Ответить | Цитировать | Написать  
проблема с css
    #33286425
хм...
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
хм...
Участник
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 
<html><head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style>
A.sub_menu {MARGIN-TOP: 5px; FONT-WEIGHT: bold; FONT-SIZE: 13px; MARGIN-BOTTOM: 5px; MARGIN-LEFT: 5px; COLOR: #0049c1; FONT-FAMILY: tahoma, verdana, sans-serif; HEIGHT: 16px; TEXT-DECORATION: none}
A.sub_menu:hover {MARGIN-TOP: 5px; FONT-WEIGHT: bold; FONT-SIZE: 13px; MARGIN-BOTTOM: 5px; MARGIN-LEFT: 5px; COLOR: #0291ff; FONT-FAMILY: tahoma, verdana, sans-serif; HEIGHT: 16px; TEXT-DECORATION: none}


.menu UL {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 190px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none}
.menu UL LI {POSITION: relative}
.menu LI UL {DISPLAY: none; LEFT: -187px; POSITION: absolute; TOP: 0px}

.UL_LI_A     {BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 0px solid; TEXT-DECORATION: none}
.UL_LI_A_END {BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 1px solid; TEXT-DECORATION: none}

HTML .menu UL LI {FLOAT: left; HEIGHT:  1 %}
HTML .menu  UL LI A {HEIGHT:  1 %}
.menu LI:hover UL {DISPLAY: block}
.menu LI.over UL {DISPLAY: block}

</style>
<!-- <SCRIPT src="drop_down.js" 
type=text/javascript></SCRIPT> -->
<script language="javascript">
startList = function() {
if (document.all&&document.getElementById) {



navRoot = document.getElementById("nav");
for (i= 0 ; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace(" over", "");
   }
   }
  }



 }
}
window.onload=startList;
</script>
</head>
<body style="margin:10px">
<ul>
<li>Один
	<ul>
	<li>один</li>
	<li>два</li>
	<li>три</li>
	<li>четыре</li>
	</ul>
</li>
<li>два</li>
<li>три</li>
<li>четыре</li>
</ul>

<br>
<table align="left">
<tr><td width="200"></td>
<td class="menu">
<UL id=nav>

  <LI>

<A href="#" class=sub_menu>Один</A>  
  	<UL>
    <LI><A class="UL_LI_A" href="http://www.filimonoff.ru/books">books</A> 
    </LI>
    <LI><A class="UL_LI_A_END" href="http://www.sql.ru/forum/actualthread.aspx?tid=219195">два</A> 
    </LI>
	</UL></LI>
</ul>
</td></tr></table>
</body></html>
...
Рейтинг: 0 / 0
23.09.2005, 16:11
| Ответить | Цитировать | Написать  
проблема с css
    #33286434
хм...
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
хм...
Участник
ps.

FAQ http://www.sql.ru/faq/faq_topic.aspx?fid=202 При добавлении кода (скажем sql) хорошим тоном, считается выделение кода используя ключевое слово выделения -
Код: plaintext
src
. Например:

Код: plaintext
1.
2.
-- some comments

select * from sysobjects
...
Рейтинг: 0 / 0
23.09.2005, 16:13
| Ответить | Цитировать | Написать  
проблема с css
    #33287189
maXmo
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
maXmo
Участник
хм... , учись, пока я жив.
Код: plaintext
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" > 
<html><head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style>
A.sub_menu {MARGIN-TOP: 5px; FONT-WEIGHT: bold; FONT-SIZE: 13px; MARGIN-BOTTOM: 5px; MARGIN-LEFT: 5px; COLOR: #0049c1; FONT-FAMILY: tahoma, verdana, sans-serif; HEIGHT: 16px; TEXT-DECORATION: none}
A.sub_menu:hover {MARGIN-TOP: 5px; FONT-WEIGHT: bold; FONT-SIZE: 13px; MARGIN-BOTTOM: 5px; MARGIN-LEFT: 5px; COLOR: #0291ff; FONT-FAMILY: tahoma, verdana, sans-serif; HEIGHT: 16px; TEXT-DECORATION: none}


.menu UL {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 190px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none}
.menu UL LI {POSITION: relative}
.menu LI UL {DISPLAY: none; LEFT: -187px; POSITION: absolute; TOP: 0px}

.UL_LI_A     {BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 0px solid; TEXT-DECORATION: none}
.UL_LI_A_END {BORDER-RIGHT: #446FEE 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #446FEE 1px solid; DISPLAY: block; PADDING-LEFT: 5px; BACKGROUND: #D2DCFB; PADDING-BOTTOM: 5px; BORDER-LEFT: #446FEE 1px solid; COLOR: #0C5EE4; PADDING-TOP: 5px; BORDER-BOTTOM: #446FEE 1px solid; TEXT-DECORATION: none}

HTML .menu UL LI {FLOAT: left; HEIGHT:  1 %}
HTML .menu  UL LI A {HEIGHT:  1 %}
.menu LI:hover UL {DISPLAY: block}
.menu LI.over UL {DISPLAY: block}

</style>
<!-- <SCRIPT src="drop_down.js" 
type=text/javascript></SCRIPT> -->
<script language="javascript">
startList = function() {
if (document.all&&document.getElementById) {



navRoot = document.getElementById("nav");
for (i= 0 ; i<navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName=="LI") {
node.onmouseover=function() {
this.className+=" over";
  }
  node.onmouseout=function() {
  this.className=this.className.replace(" over", "");
   }
   }
  }



 }
}
window.onload=startList;
</script>
</head>
<body style="margin:10px">
<ul>
<li>Один
	<ul>
	<li>один</li>
	<li>два</li>
	<li>три</li>
	<li>четыре</li>
	</ul>
</li>
<li>два</li>
<li>три</li>
<li>четыре</li>
</ul>

<br>
<table align="left">
<tr><td width="200"></td>
<td class="menu">
<UL id=nav>

  <LI>

<A href="#" class=sub_menu>Один</A>  
  	<UL>
    <LI><A class="UL_LI_A" href="http://www.filimonoff.ru/books">books</A> 
    </LI>
    <LI><A class="UL_LI_A_END" href="http://www.sql.ru/forum/actualthread.aspx?tid=219195">два</A> 
    </LI>
	</UL></LI>
</ul>
</td></tr></table>
</body></html>
------------------
- А как в Интеpнете pаботать? - Сначала нужно узнать, что вам нужно rtfm
...
Рейтинг: 0 / 0
24.09.2005, 18:19
| Ответить | Цитировать | Написать  
6 сообщений из 6, страница 1 из 1
Форумы / Программирование [игнор отключен] [закрыт для гостей] / проблема с css
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]