Преработка на html код.

FestarBG

Registered
Това са категориите с игри на моя сайт:
likeeethiiiiiisic2.png

Самия изглед се променя от index.php и ето това са редовете за това меню:
<tr>
<td height="30px" background="<? echo "$site_url"?>/templates/v3/menback.png" bgcolor="#FF8700"><div align="left"><span class="style4">  
<? include('./modules/menu_horizontal.php');?>
</span></div></td>
</tr>

Тъй като index.php използва мой си style.css и немога да добавя този от урока ТуК.А не знам дали може 1 html документ да използва 2 css файла.А много искам да използвам това меню... :?:
 
<link rel="stylesheet" type="text/css" href="css.css" />
<link rel="alternate stylesheet" type="text/css" href="css2.css" />

<tr>
<td height="30px">
тука слагаш кода за менюто дето искаш</td>
</tr>

:roll:
 
link rel="stylesheet" type="text/css" href="css2.css" />
link rel="stylesheet" type="text/css" href="css1.css" />
така няма проблеми може да слагаш по2 и пове4е цсса
 
Няма никакъв проблем да използваш н-брой стилови шаблони само имената на класовете/ид-селекторите да не съвпадат и разбира се да няма взаимно изключващи се или противоречиви стойности за един елемент.

В противен случай важи едно много сбърканото правило за приоритета - при съвпадение се изпълнява прочетеното последно от браузъра (ако стиловете са с еднакъв ранг напр само външни) или вътрешните за целия документ (при противоречие външни/вътрешни за документа) или вложените шаблони (те са с най-висок приоритет).

Стандарта на W3C казва друго, но браузърите правят така поне според онова, к съм чел и донякъде от практиката ми. :)

ПП: изпреварили са ме и са далеч по-конкретни ;)
 
Ето така ми е част от кода index.html:
<link rel="alternate stylesheet" type="text/css" href="css2.css" />
А това ми е кода за менюто:
<tr>
<td height="30px" border="1">
<div class="body">
<div id="menu">
<div id="items">
<a href="#" id="selected">Начало</a><a href="#">линк</a><a href="#">линк1</a><a href="#">линк2</a>
<a href="#">линк3</a><a href="#">линк4</a><a href="#">линк5</a><a href="#">линк6</a>
<a href="#">линк7</a><a href="#">линк8</a><a href="#">Край на ликовете</a>
</div>
</div></td>
</tr>

Направил съм css2.css,ето го и него:
html, body
{
color: #8c909a;
font-family: Verdana, sans-serif;
font-size: 12px;
padding: 0;
margin: 0;
background: #1e1e1e;

}


.body
{
margin-left: auto;
margin-right: auto;
padding: 0;
width: 800px;
}



#menu
{
margin: 10px 0;
background: #aeff00 url("back.gif");
height: 42px;
line-height: 42px;
}



#menu a
{
color: #000;
font-weight: bold;
border-right: 1px solid #5b9400;
display: block;
float: left;
padding: 0 10px;
}

#menu a:hover
{
background: #aeff00 url("hover.gif");
}

#selected
{
background: #aeff00 url("back.gif");
}

a
{
color: #fbaf32;
text-decoration: none;
}

a:hover
{
color: #f0e155;
}

Всичко си е както трябва,имам си и back.gif и hover.gif но като си вляза в сайта ня мястото на менюто не се вижда нищо,а ако сложа мишката отгоре се виждат "Начало","Линк 1","Линк 2" и тн. но сини,а и няма фон,а си имам картинките.Сигурно нещо се засичат с другия css,но в css-a не съм добър и незнам как да променя div-овете и id-тата че да не се повтарят.. :cry:
 
дай и двата CSS файла ;)

а във втория махни

Код:
html, body
{
color: #8c909a;
font-family: Verdana, sans-serif;
font-size: 12px;
padding: 0;
margin: 0;
background: #1e1e1e;

}


.body
{
margin-left: auto;
margin-right: auto;
padding: 0;
width: 800px;
} 

...

a
{
color: #fbaf32;
text-decoration: none;
}

a:hover
{
color: #f0e155;
}

а и промени кода с който вкарваш CSS файла ;)

<link href="css1.css" rel="stylesheet" type="text/css">
<link href="css2.css" rel="stylesheet" type="text/css">
 

Back
Горе