Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów
Probem z menu w html i css ! - Wersja do druku

+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: Początkujący webmaster (https://www.webmastertalk.pl/forum-poczatkujacy-webmaster)
+--- Wątek: Probem z menu w html i css ! (/thread-probem-z-menu-w-html-i-css)

Strony: 1 2 3

RE: Probem z menu w html i css ! - kubax7 - 28-02-2012

(28-02-2012, 04:41)Kartofelek napisał(a): Powiedz mi co w tych linijkach jest błędne:

Kod:
#menu ul, ul li {
#menu ul a:link, ul a:visited {
#menu1  ul, ul li {

Szczerze to nie wiem Sad Ogólnie z problemem sobie i tak poradziłem, ale możesz mi powiedzieć w czym jest błąd ?

RE: Probem z menu w html i css ! - Moody - 28-02-2012

A mnie się wydaje, że powinno być tak:

Kod:
#menu ul, #menu li {
#menu ul a:link, #menu ul a:visited {
#menu1  ul, #menu1 ul li {

Jeśli nie to proszę mnie poprawić Smile



RE: Probem z menu w html i css ! - kubax7 - 28-02-2012

Ja zrobiłem tak, że dodałem do ul i li numeracje


Kod:
<ul1>  <li1> </li1>    </ul1>

<ul2><li2> </li2></ul2>

Nie wiem cyz to dobry pomysł ale mi działa. Zastanawiałem sie nad tym czy jak się robi dwóch menu to nie powinną się ich robić na klasach ??




RE: Probem z menu w html i css ! - Kartofelek - 28-02-2012

Moody +
kubax7 -

RE: Probem z menu w html i css ! - Moody - 28-02-2012

(28-02-2012, 22:37)kubax7 napisał(a): Nie wiem cyz to dobry pomysł ale mi działa. Zastanawiałem sie nad tym czy jak się robi dwóch menu to nie powinną się ich robić na klasach ??

Dlaczego na klasach? A będziesz miał więcej niż jedno takie samo menu? Bo jeśli coś jest niepowtarzalne to stosujemy identyfikator.

(28-02-2012, 22:42)Kartofelek napisał(a): Moody +
kubax7 -

Coś tam się jednak umie Tongue

RE: Probem z menu w html i css ! - kubax7 - 29-02-2012

Heh przegrałem bitwe ale nie wojne haha Big Grin Ogólnie tego mojego pomysłu z ul1 i ul2 sie nie stosuje ??? Człowiek uczy sie na błedach pozdro Big Grin

RE: Probem z menu w html i css ! - Pedro84 - 29-02-2012

(29-02-2012, 00:04)kubax7 napisał(a): Heh przegrałem bitwe ale nie wojne haha Big Grin Ogólnie tego mojego pomysłu z ul1 i ul2 sie nie stosuje ??? Człowiek uczy sie na błedach pozdro Big Grin
A co to jest <ul1> i <ul2>?

RE: Probem z menu w html i css ! - Moody - 29-02-2012

Ze znacznikami ul1 i ul2 przegrałeś też wojnę Big Grin

RE: Probem z menu w html i css ! - kubax7 - 29-02-2012

(29-02-2012, 00:37)Pedro84 napisał(a): A co to jest <ul1> i <ul2>?


No zrobiłem coś takiego
Kod:
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
   <meta http-equiv="Content-type" content="application/xhtml+xml; charset=iso-8859-2" />
   <meta name="Description" content=" [wstaw tu opis strony] " />
   <meta name="Keywords" content=" Lech Poznań " />
   <meta name="Author" content=" Jakub Nawrocki " />
   <meta name="Generator" content="kED" />

   <title>Lech Poznań </title>

   <link rel="stylesheet" href=" style.css" type="text/css" />
</head>
<body>

<div id="strona">
    <div id="menu">
<ul1>
<li1><a href="http://forum.pclab.pl/topic/770595-Upgrade-starego-grata-za-max-1000zł">STRONA GŁÓWNA</a></li1>
<li1><a href="#">DOWNLOAD</a></li1>
<li1><a href="#">KONTAKT</a></li1>
<li1><a href="#">FORUM</a></li1>
</ul1>
</div>
<div id="menu1">
<ul2>
<li2><a href="#">STRONA GŁÓWNA</a></li2>
<li2><a href="#">MENU1</a></li2>
<li2><a href="#">MENU2</a></li2>
<li2><a href="#">MENU3</a></li2>
<li2><a href="#">MENU4</a></li2>
<li2><a href="#">MENU5</a></li2>

</ul2>



</div>

<div id="top"><a name="odsylacz"></a></div>
<div id="prawa"><p>Tekst</P></div>
<div id="stopka"><a href="file://localhost/C:/Users/Jakub/Desktop/Szkoła/www/index.html#odsylacz">odsylacz</a></div>
<div id="end"><p style="color:red">sŁONY <a href="http://www.interia.pl">Intera</a></p></div>
<div id="obrazek"><img src="k.png" width="550" height="50"></div>




</div>
</body>
</html>


Kod:
body{background-image: url("bg-page.jpg") ;
background-size: 100%;
background-attachment: scroll;
background-repeat:repeat-y;
}


*{
margin: 0 auto;
padding: 0;
}


#strona{
margin-top:10px;
margin-bottom:10px;
width:800px;
height:1000px;
background-color:black;
border:solid 1px white;


}

#menu{
margin-top:250px;
margin-left:140px;
padding-top:1px;
padding-left:2px;
width:520px;
height:29px;
background:#E5E4E2;}

#menu ul1, ul1 li1 {
     display: block;
     list-style: none;
     margin-right: 3px;
     padding: 0;
}

#menu ul1 {
     position: absolute;
}

#menu ul1 li1 {
     float: left;
     border-width: 0 1px 1px 1px;
     border-style: solid;
     border-color: transparent #25b #25b #9ce;
}

#menu ul1 a:link, ul1 a:visited {
     text-decoration: none;
    
     display: block;
     width: 125px;
     text-align: center;
     padding: 5px 0;
     font-weight: bold;
     font-size: 12px;
     color:#E5E4E2;
     background-image:url("nie15.gif");
     border-top: 2px solid #25b;
}

#menu ul1 a:hover {
     background:#F0F0F0;
}


#menu1{
width:800px;
height:35px;
margin-top:-250px;
background-color:white;
}


#menu1  ul2, ul2 li2 {
     display: block;
     list-style: none;
     margin: 0;
     padding: 0;
}

#menu1 ul2 li2 {
     float: left;
}

#menu1 ul2 a:link, ul2 a:visited {
text-decoration: none;
display:block;
background-image: none;}

#top{

margin-top:200px;
margin-left:5px;
position:relative;
float:left;
width:600px;
height:40px;
background-color:white;
border:solid 1px red;}

#prawa{
margin-top:200px;
margin-right:5px;
float:right;
width:50px;
height:50px;
background-color:white;
border: solid 1px red;
}

#stopka{
margin-top:860px;
width:600px;
height:20px;
background-color:blue;
border: solid 1px red;
}

#end{

margin-top:-440px;
margin-left:5px;
width:788px;
height:400px;
background-color:blue;
border: solid 1px white;
}

#obrazek{
position:absolute;
background-color:white;
border:solid 1px red;
margin-top:-450px;
margin-right:5px;
margin-left:100px;
}
I wsyzsło mi dokładnie coś takiego jak wg. forumowiczów poprawnie czyli tak

Kod:
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
   <meta http-equiv="Content-type" content="application/xhtml+xml; charset=iso-8859-2" />
   <meta name="Description" content=" [wstaw tu opis strony] " />
   <meta name="Keywords" content=" Lech Poznań " />
   <meta name="Author" content=" Jakub Nawrocki " />
   <meta name="Generator" content="kED" />

   <title>Lech Poznań </title>

   <link rel="stylesheet" href=" style.css" type="text/css" />
</head>
<body>

<div id="strona">
    <div id="menu">
<ul>
<li><a href="http://forum.pclab.pl/topic/770595-Upgrade-starego-grata-za-max-1000zł">STRONA GŁÓWNA</a></li>
<li><a href="#">DOWNLOAD</a></li>
<li><a href="#">KONTAKT</a></li>
<li><a href="#">FORUM</a></li>
</ul>
</div>
<div id="menu1">
<ul>
<li><a href="#">STRONA GŁÓWNA</a></li>
<li><a href="#">MENU1</a></li>
<li><a href="#">MENU2</a></li>
<li><a href="#">MENU3</a></li>
<li><a href="#">MENU4</a></li>
<li><a href="#">MENU5</a></li>

</ul>



</div>

<div id="top"><a name="odsylacz"></a></div>
<div id="prawa"><p>Tekst</P></div>
<div id="stopka"><a href="file://localhost/C:/Users/Jakub/Desktop/Szkoła/www/index.html#odsylacz">odsylacz</a></div>
<div id="end"><p style="color:red">sŁONY <a href="http://www.interia.pl">Intera</a></p></div>
<div id="obrazek"><img src="k.png" width="550" height="50"></div>




</div>
</body>
</html>

Kod:
body{background-image: url("bg-page.jpg") ;
background-size: 100%;
background-attachment: scroll;
background-repeat:repeat-y;
}


*{
margin: 0 auto;
padding: 0;
}


#strona{
margin-top:10px;
margin-bottom:10px;
width:800px;
height:1000px;
background-color:black;
border:solid 1px white;


}

#menu{
margin-top:250px;
margin-left:140px;
padding-top:1px;
padding-left:2px;
width:520px;
height:29px;
background:#E5E4E2;}

#menu ul, #menu li {
    display: block;
    list-style: none;
    margin-right: 3px;
    padding: 0;
}

#menu ul {
    position: absolute;
}

#menu ul, #menu li {
    float: left;
    border-width: 0 1px 1px 1px;
    border-style: solid;
    border-color: transparent #25b #25b #9ce;
}

#menu ul a:link,#menu ul a:visited {
    text-decoration: none;
    
    display: block;
    width: 125px;
    text-align: center;
    padding: 5px 0;
    font-weight: bold;
    font-size: 12px;
    color:#E5E4E2;
    background-image:url("nie15.gif");
    border-top: 2px solid #25b;
}

#menu ul a:hover {
    background:#F0F0F0;
}


#menu1{
width:800px;
height:35px;
margin-top:-250px;
background-image: url("kuk.png");
background-size:100% ;
}


#menu1  ul, #menu1 li {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0;
}

#menu1 ul, #menu1 li {
    float: left;
}

#menu1 ul a:link,#menu1 ul a:visited {
text-decoration: none;
display:block;
background-image: none;}

#top{

margin-top:200px;
margin-left:5px;
position:relative;
float:left;
width:600px;
height:40px;
background-color:white;
border:solid 1px red;}

#prawa{
margin-top:200px;
margin-right:5px;
float:right;
width:50px;
height:50px;
background-color:white;
border: solid 1px red;
}

#stopka{
margin-top:860px;
width:600px;
height:20px;
background-color:blue;
border: solid 1px red;
}

#end{

margin-top:-440px;
margin-left:5px;
width:788px;
height:400px;
background-color:blue;
border: solid 1px white;
}

#obrazek{
position:absolute;
background-color:white;
border:solid 1px red;
margin-top:-450px;
margin-right:5px;
margin-left:100px;
}

I teraz nie wiem czy stosowanie "numeracji" , że tak powiem jest dobre czy nie ?? Bo kiedyś chyba coś takiego widziałem Cool







RE: Probem z menu w html i css ! - Pedro84 - 29-02-2012

Nie ma czegoś takiego jak <ul1> czy <ul2>.