Witam!
Mam pytanie jak mogę ustawić, aby moja strona w HTML oraz CSS była wyświetlana pod każdą szerokością monitora? Tzn., aby dostosowała się do jego rozmiarów. Wiem, że takie coś istnieje, bo wiele for / stron z tego korzysta, a nigdy nie próbowałem tego.
Zawsze wkładalem wszystko w div #page i ustalałem szerokość 1000px, ale wtedy brzydko to wyglądało.
Pełna wersja: [CSS][HTML] Szerokość strony
Czyli np.
?
No i mam jeszcze pytanie. Jak mogę zrobić taki pasek jak na Facebooku? Chodzi o tą górę, że jest on niebieski, a reszta biała.
Cytat
#page {
width: 100%;
font-size: 11px;
font-family: Tahoma;
color: #000;
background-color: #fff;
}
width: 100%;
font-size: 11px;
font-family: Tahoma;
color: #000;
background-color: #fff;
}
?
No i mam jeszcze pytanie. Jak mogę zrobić taki pasek jak na Facebooku? Chodzi o tą górę, że jest on niebieski, a reszta biała.
Chodzi o to co zaznaczyłem na czerwono moją pro-elowską paintową strzałką.
Ten pasek dostosowuje się do każdego monitora i jest tak jakoś wykonany, że:
-------------
LOGO - ZNAJOMI, WIADOMOŚCI, POWIADOMIENIA
-------------
I to wszystko co w tym wyżej jest na niebieskim pasku, a reszta po prostu biały kolor strony.
Mniej więcej tak:
Niebieski - logo, menu
Biały - tablica i inne duperele
Niebieski - stopka
No robisz diva naglowek dajesz mu tlo niebieskie określasz rozmiar i połozenie
a cale body dajesz biale
A to co ma facebook tj logo fejsa czy tam wiadomości powiadomienia to są tylko obrazki które musisz nałożyć
cos takiego tak na szybko
a cale body dajesz biale
A to co ma facebook tj logo fejsa czy tam wiadomości powiadomienia to są tylko obrazki które musisz nałożyć
Kod
body{
background-color:white;
}
#naglowek{
height: 50px;
background-color:blue;
width: 100%;
position:absolute;
top:5px;
}
background-color:white;
}
#naglowek{
height: 50px;
background-color:blue;
width: 100%;
position:absolute;
top:5px;
}
cos takiego tak na szybko
Hmm.
Mam problem, a mianowicie.
A, tutaj HTML
Nie wiem na czym polega ten problem, ale wygląda to tak:
http://hosting.webthemes.pl/upload/original/Beztytuu_13.png
Po prostu strona nie dostowała się do monitora i pojawił się pasek przesuwający całą stronę.
W dodatku ten nagłówek - TOP przesunął się.
Mam problem, a mianowicie.
Kod
body {
width: 100%;
font-size: 11px;
font-family: Tahoma;
}
#top {
height: 30px;
background-color: blue;
}
width: 100%;
font-size: 11px;
font-family: Tahoma;
}
#top {
height: 30px;
background-color: blue;
}
A, tutaj HTML
Kod
<!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 content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>{$title}</title>
<link href="templates/css/index.css" media="screen" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="top">TOP</div>
Strona Główna.
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>{$title}</title>
<link href="templates/css/index.css" media="screen" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="top">TOP</div>
Strona Główna.
</body>
</html>
Nie wiem na czym polega ten problem, ale wygląda to tak:
http://hosting.webthemes.pl/upload/original/Beztytuu_13.png
Po prostu strona nie dostowała się do monitora i pojawił się pasek przesuwający całą stronę.
W dodatku ten nagłówek - TOP przesunął się.
Najlepiej poczytaj o Reset CSS Style, jest do tego klasa, która na początku resetuje cały widok, był o tym ostatnio nawet temat na forum, bardzo ułatwia pracę.
Takie cóś machnij
Kod
body {
width: 100%;
font-size: 11px;
font-family: Tahoma;
margin:0;
}
#top {
height: 30px;
background-color: blue;
margin-top:1px;
width:100%;
}
width: 100%;
font-size: 11px;
font-family: Tahoma;
margin:0;
}
#top {
height: 30px;
background-color: blue;
margin-top:1px;
width:100%;
}
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.