Здраствуйте не судите строго, я не нашол на форуме решение данного вопроса.
Я чтоб долго не мучаться с созданием главного меню поискал по интернету и нашол
http://www.zarabotokest.ru/index.php/sitostroenie/14-meny-css.htmlкак мне это интегрировать к ебе
Код взят с источника в нэте
html файл
<ul>
<li><a href="/ссылка" title="Главная">Блог</a></li>
<li><a href="/ссылка" title="Мои услуги">Мои услуги</a></li>
<li><a href="/ссылка" title="О проекте">О проекте</a></li>
<li><a href="/ссылка" title="Реклама">Реклама</a></li>
<li><a href="/ссылка" title="Карта блога">Карта блога</a></li>
<li><a href="/ссылка" title="Контакты">Контакты</a></li>
</ul>
CSS файл
body {
margin:100px;
padding:0
}
ul{
margin:0;
padding:0;
list-style-type:none;
height:50px;
width: 550px;
font-size:14px;
background: url('/file1.png') repeat-x;
font-family:Arial,Verdana,Helvitica,sans-serif;
}
ul li a{
display:block;
float:left;
color:#FFFFFF;
text-decoration:none;
text-align:center;
padding:15px 15px 5px 15px;
height:50px;
}
ul li a:hover {
color:#FFFFFF;
background: url('/file2.png') repeat-x
и вот мой навсякий случай index.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="
http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >
<head>
<jdoc:include type="head" />
<link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/foto/css/template.css" type="text/css" />
</head>
<body>
<div id="header"></div>
<div class="headmenu"></div>
<div id="container">
<div class="headmenu">
<div id="mainlevel-nav"><jdoc:include type="modules" name="top" /> </div>
</div>
<div id="content" class="float"><jdoc:include type="component" /></div>
<div id="sidebar_right"class="float_right"><jdoc:include type="modules" name="right" /></div>
<div id="footer" class="clear"><jdoc:include type="modules" name="footer" /></div>
</div>
</body>
</html>
и вот мой навсякий случай template.css
div#header{
background-image: url("../images/head.jpg")!important;
width:85%;
height:408px;
margin:0 auto;
background-color:#7C1824;
background-position: center top;
background-repeat: no-repeat;
}
#mainlevel-nav{
height:55px;
margin:0;
padding:0;
list-style-type:none;
height:50px;
width: 550px;
font-size:14px;
background: url('/menu_bg.png') repeat-x;
font-family:Arial,Verdana,Helvitica,sans-serif;
}
/* ФОРМАТИРОВАНИЕ НАВИГАЦИИ/МЕНЮ (MENU) */
a.mainlevel{} /* форматирование ГЛАВНЫХ(main, не вложенных) элементов меню */
a.mainlevel:link {}
a.mainlevel:visited {}
a.mainlevel:hover {}
#active_menu {} /* форматирование для элемента меню, когда оно активно, даже в позиции main/sub*/
ul#mainlevel-nav {}
ul#mainlevel-nav li{}
#mainlevel-nav a:link {}
#mainlevel-nav a:visited{}
#mainlevel-nav a:hover {}
a.sublevel{} /* форматирование вложенных элементов меню (имеющих родителей) */
a.sublevel:link {}
a.sublevel:visited {}
a.sublevel:hover {}
.headmenu{
}
* {
padding: 0;
margin: 0;
}
img {
border: 0;
}
body {
font-family: Arial, Helvetica, sans-serif;
line-height: 1.3em;
margin: 0;
padding: 0;
font-size: 13px;
color: #7C1824;
background-color:#982B31;
}
a:link, a:visited {
text-decoration: underline;
font-weight: normal;
color: #000;
outline: none;
text-align: left;
}
.float {
float: left;
}
.float_right {
float: right;
}
.clear {
clear: both;
}
.overall {
background-color: #fff;
}
div.center {
text-align: center;
margin: 0px auto 0 auto;
padding: 0;
width: 950px;
background: #FFFFFF;
}
#container {
width:85%;
margin: auto;
background-color: #7C1824;
border: 1px solid #e2e2e2;
text-align: left;
}
#top {
text-align: center;
background-color:#f4f9fc;
height: 100px;
}
#content {
width: 60%;
text-align: left;
background-color:#f4f9fc;
padding: 5px;
}
#sidebar_left {
text-align: center;
background-color:#f4f9fc;
width: 165px;
border-right: 1px solid #e2e2e2;
border-bottom: 1px solid #e2e2e2;
padding: 5px;
}
#sidebar_right {
background-color:#f4f9fc;
text-align: center;
width: 30%;
border-left: 1px solid #e2e2e2;
border-bottom: 1px solid #e2e2e2;
padding: 5px;
}
#footer {
background-color:#f4f9fc;
text-align:center;
border-top: 1px solid #e2e2e2;
border-botom: 1px solid #e2e2e2;
padding: 5px;
}