Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [HTML][CSS]Menu a wstawienie linku
kmaksiu
post 30.03.2013, 10:25:36
Post #1





Grupa: Zarejestrowani
Postów: 17
Pomógł: 0
Dołączył: 3.03.2013

Ostrzeżenie: (10%)
X----


Witam mam problem z wstawieniem linku przez utworzone menu.

problem wygląda następująco.



Uploaded with ImageShack.us

Jak widać po wstawieniu linku, tworzy się blok z menu.

kod.

Kod
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
<head>
  <meta name="Description" content=" Strona poświęcona promocji młodych raperów. " />
  <meta name="Keywords" content=" fejm muzyka rap hip hop podziemie underground " />
  <meta name="Author" content=" Maksymilian Kieroński " />
  <meta name="Generator" content="kED" />
  <meta http-equiv="Content-Type" CONTENT="text/html; charset=iso-8859-2">
  <title> [tytuł strony] </title>
    

    

  <style type="text/css">
    body { margin: 0;
    background-color: #ebebeb
    
    }
    
    div.baner {
    background-color: #5a5a5a;
    width: 100%;
    height: 250px
    }
    
    p.zdj {
    height: 300px;
    background-image: url(zacieki.jpg);
    background-repart: repart-x;
    margin: 0;
    
    }
    
    
    div.tresc {
    
    width: 600px;
    height: 500px;
    background-color: #CCCCCC;
    margin-left: 20px;
    margin-top: 2cm;
    position: absolute; top: 250px;
    border-style: dotted;
    overflow: hidden;
    border-width: 1px;
    }
    
    div.link {
    width: 300px;
    background-color: #cccccc;
    margin-left: 720px;
    margin-top: 2cm;
    border-style: double;
    position: absolute; top: 250px;
    
    
    }
    
    div.menu {
    width: 100%;
    height: 65px;
    background-color: black;
  position: absolute;
    top: 165px;
    
    }
    
    ul li {
    list-style: none;
    }
    
    a:link,a:visited,a:hover,a:active {
    text-decoration: none;
    display: block;
    float: left;
    line-height: 65px;
    width: 200px;
    color: white;
    text-align: center;
    font-size: 50px;
    
    }
    
    a:hover {
    color: silver;
    background-color: black;
    }
    
    a:active {
    color: silver;
    background-color: black:
    }
    
    @font-face {
    font-family: MagikMarker;
    src: url(MagikMarker.otf) format("opentype");
}

.menu ul {
   margin-top: 0px;
}


div.ramka_menu {
background-image: url(menu1.jpg);
repart: repart-x;
height: 20px;
position: absolute;
    top: 150px;
    width: 100%;
}

div.ramka_menu2 {
background-image: url(menu2.jpg);
repart: repart-x;
height: 20px;
width: 100%;
position: absolute;
top: 228px;

}
    </style>

</head>
<body>

<div class="baner">
<center><img src="baner.jpg" alt="" width="900" height="150" /></center>
</div>


<div  class="ramka_menu">
</div>
<div class="menu" align="left">

<ul style="font-family: MagikMarker">
<li><a href="index.html"><b>Home</b></a></li>
<li><a href="wideo.html"><b>Wideo</b></a></li>
<li><a href="muzyka.html"><b>Muzyka</b></a></li>
<li><a href="kontakt.html"><b>Kontakt</b></a></li>
<li><a href="http://www.youtube.com/subscription_center?add_user=fejmpodziemia"><b>Subskrybuj</b></a></li>
</ul>

</div>

<div class="ramka_menu2">
</div>



<p class="zdj">


<div class="tresc">
gffsdfnsdjknfkjdsnfkjsdnfjksdnkjfns

</div>

<div class="link"><br /><br />
&nbsp;<img src="Facebook_icon.jpg" alt="" width="43" height="43" />
<a target="_blank" href="http://www.facebook.com/pages/Fejm/280577751970681">Fejm </a>
</div>
</body>
</html>
Go to the top of the page
+Quote Post
Posio
post 30.03.2013, 23:48:56
Post #2





Grupa: Zarejestrowani
Postów: 417
Pomógł: 44
Dołączył: 23.06.2011

Ostrzeżenie: (0%)
-----


odpowiada za to ten fragment kodu:
  1. a:link,a:visited,a:hover,a:active {
  2. text-decoration: none;
  3. display: block;
  4. float: left;
  5. line-height: 65px;
  6. width: 200px;
  7. color: white;
  8. text-align: center;
  9. font-size: 50px;
  10.  
  11. }
  12.  


Chyba nie muszę nic wiecej dodawać ?

Ten post edytował Posio 30.03.2013, 23:49:32
Go to the top of the page
+Quote Post
-kmaksiu1-
post 31.03.2013, 20:07:45
Post #3





Goście







tak wiem, ze odpowiada ten fragment, lecz nie wiem co mam teraz zrobic :-(
Go to the top of the page
+Quote Post
-kmaksiu1-
post 2.04.2013, 10:44:53
Post #4





Goście







Czy na prawdę nikt nie umie mi pomóc? próbowałem już robić a.link:link itp i nic nie pomaga. Jak mogę się tego pozbyć proszę bardzo o pomoc, bo głowie się tylko nad tym i moja nauka zatrzymała się w tym miejscu. :/
Go to the top of the page
+Quote Post
!*!
post 2.04.2013, 10:47:59
Post #5





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


Skoro w css, masz display:block, to logiczne że tak się zachowuje. Zmień to na inline.


--------------------
Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta).
Go to the top of the page
+Quote Post
-kmaksiu1-
post 2.04.2013, 11:02:05
Post #6





Goście







Nie pomaga nadal link zachowuje się jak menu a chciałbym, żeby był nie zależny i wygladał jak klasyczny link w tekscie.
Go to the top of the page
+Quote Post
!*!
post 2.04.2013, 11:04:21
Post #7





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


W CSS nie ma opcji reset. Musisz to zrobić ręcznie. Sprawdź jakie wartości domyślne maja atrybuty http://www.signs.pl/html/


--------------------
Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta).
Go to the top of the page
+Quote Post
-kmaksiu1-
post 2.04.2013, 11:26:57
Post #8





Goście







Tylko jak mam to zrobić ręcznie. Próbowałem już chyba wszystkich znanych mi sposobów. Dopiero się uczę pisać CSS, i taki problem jak tu jest dla mnie sporym problemem.
Go to the top of the page
+Quote Post
lobopol
post 2.04.2013, 11:27:46
Post #9





Grupa: Zarejestrowani
Postów: 1 729
Pomógł: 346
Dołączył: 4.04.2009

Ostrzeżenie: (0%)
-----


  1. a:link,a:visited,a:hover,a:active
  2. na
  3. .menu a:link,.menu a:visited,.menu a:hover, .menu a:active


--------------------
Go to the top of the page
+Quote Post
!*!
post 2.04.2013, 11:55:51
Post #10





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


Cytat(kmaksiu1 @ 2.04.2013, 12:26:57 ) *
Tylko jak mam to zrobić ręcznie. Próbowałem już chyba wszystkich znanych mi sposobów. Dopiero się uczę pisać CSS, i taki problem jak tu jest dla mnie sporym problemem.


Dla każdego atrybutu css jaki masz, sprawdzasz na tejs tronie jaką ma wartość domyślną i taką zapisujesz.


--------------------
Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta).
Go to the top of the page
+Quote Post
krzysiekk
post 2.04.2013, 21:01:45
Post #11





Grupa: Zarejestrowani
Postów: 155
Pomógł: 17
Dołączył: 13.03.2006
Skąd: Jaworze

Ostrzeżenie: (0%)
-----


witam
na początku proponuje zaprzyjażnić sie z W3C Validatorem
http://jigsaw.w3.org/css-validator/validator

masz błedy w css -sie , złe nazwy i brak średników ...


nie wiem czy Cie dobrze rozumie jesli to o to chodzi to ja bym to tak zrobił

  1.  
  2. ...
  3. ul.menu a:link,ul.menu a:visited,ul.menu a:hover,ul.menu a:active {
  4. text-decoration : none;
  5. display : block;
  6. float : left;
  7. line-height : 65px;
  8. width : 200px;
  9. color : white;
  10. text-align : center;
  11. font-size : 50px;
  12. }
  13. ..


i menu
  1. <ul class="menu">
  2. <li><a href="index.html"><b>Home</b></a></li>
  3. <li><a href="wideo.html"><b>Wideo</b></a></li>
  4. <li><a href="muzyka.html"><b>Muzyka</b></a></li>
  5. <li><a href="kontakt.html"><b>Kontakt</b></a></li>
  6. <li><a href="#"><b>Subskrybuj</b></a></li>
  7. </ul>



ltutaj przesyłam adres do pliku RESETU css
http://meyerweb.com/eric/tools/css/reset/

Ten post edytował krzysiekk 2.04.2013, 21:18:39
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 24.07.2025 - 13:45