Ocena wątku:
- 0 głosów - średnia: 0
- 1
- 2
- 3
- 4
- 5
[CSS] Divy, Dwa kolory tła, Szablon
|
Liczba postów: 13
Liczba wątków: 2
Dołączył: 09-01-2011
Reputacja:
0
12-01-2011, 15:39
(Ten post był ostatnio modyfikowany: 12-01-2011, 15:51 przez maciejf.)
Witam,
chciałbym zrobic dwu lub więcej kolorowe tło,, skorzystałem z metody:
http://webmasterka.wordpress.com/2008/01/03/tlo-na-stronie/
ale jak zrobie w ten sposób to rozjerzdza mi sie szablon, inaczej divy związane z tłem przesuwają mi szablon a ja bym chciał aby były tłem(jak sekcja body)...
jak to zrobic??jak zrobic aby móc edutować tło jak zechce ale zeby ta edycja nie gryzła sie z szablonem....
Liczba postów: 578
Liczba wątków: 11
Dołączył: 06-01-2011
Reputacja:
23
12-01-2011, 16:38
(Ten post był ostatnio modyfikowany: 12-01-2011, 16:39 przez Ancik.)
Witaj,
Domyślam się, że chodzi Ci o ostatni przykład opisany w artykule. Zakładam też, że robisz to w taki sposób, że ustalasz kolory dla div1 i div2 po czym oba divy zostawiasz puste i pod nimi piszesz treśc. Niestety nie tak to działa. Wyobraź sobie, że ustawiasz tło diva na kolor czarny, i w tym divie musisz umieszczac już treśc, która ma znajdowac się na czarnym tle. To nie działa tak, że div jest Ci potrzebny tylko do ustalenia koloru. Załóżmy, że chcesz aby tło divu TOP było żółte:
Kod: <div id="top">
<div id="logo"></div>
<div id="menu"></div>
</div>
CSS
Kod: #top { background: yellow;}
Widzisz, że w tym przykładzie, div TOP nie posłużył tylko do ustalenia koloru, ale zawarł w sobie też całą treśc topu. Gdyby LOGO i MENU nie zawierało sie w TOPIE, znalazło by się teraz pod nim. Mam nadzieje, że zrozumialeś. Radze Ci na początku poczytac jakies tutoriale ukazujące projektowanie strony od początku do końca (od photoshopa do zakodowania).
PS. Na przyszłośc zamieszczaj kod do strony, bo nie wykluczone, że wszystko to napisałem niepotrzebnie.
Pozdrawiam.
Liczba postów: 2,411
Liczba wątków: 14
Dołączył: 10-08-2009
Reputacja:
132
Z ciekawości zajrzałem na tą stronę z przykładami. Co to niby ma być ten ostatni przykład?
Liczba postów: 13
Liczba wątków: 2
Dołączył: 09-01-2011
Reputacja:
0
Ok, rozumiem ,że w Divie mogą byc różne rzeczy ale jak zrobić to tło dwukolorowe które by nie naruszało szablonu strony....
Toroche bez sensu byłaby przytoczona przeze mnei porada, która zakłada że na straonie znajduje się tylko tło...
Np. chciałbym zrobic czarne tło i dwa żółte paski, jeden poziomy a drugi pinowy...jest to mozliwe??
Kod html:
Kod: <body>
<!--TŁO-->
<div id="tlo1"></div>
<div id="tlo2"></div>
<div id="SZABLON">
<div id="NAGLOWEK">Tekst</div>
<div id="MENU">Menu nawigacyjne</div>
<div id="TRESC">Tre¶ć strony</div>
<div id="STOPKA">Stopka serwisu</div>
</div>
</body>
</html>
.css
Kod: html, body {
background-color: #000000;
color: #FFFFFF;
margin: 0;
padding: 0;
}
<!--TŁO-->
#tlo1 {
background-color: #FFFF00;
margin-left: 50px;
width: 5px;
}
#tlo2 {
background-color: #FFFF00;
height: 5px;
margin-top: 50px;
}
#SZABLON {
margin-left: auto;
margin-right: auto;
overflow: hidden;
position: relative;
width: 780px;
}
#NAGLOWEK {
background-color: #000000;
height: 300px;
background-image: url(image/www.jpg);
}
#MENU {
background-color: #000000;
height:5cm;
width: 150px;
outline-style: double;
outline-width: thin;
outline-color: white;
float: left;
overflow: hidden;
}
#TRESC {
background-color: #000000;
height:5cm;
width: 630px;
outline-style: double;
outline-width: thin;
outline-color: white;
float: left;
overflow: hidden;
}
#STOPKA {
background-color: #000000;
height:1cm;
clear: both;
width: 100%;
outline-style: double;
outline-width: thin;
outline-color: white;
}
pre {
overflow: auto;
}
Liczba postów: 578
Liczba wątków: 11
Dołączył: 06-01-2011
Reputacja:
23
12-01-2011, 18:25
(Ten post był ostatnio modyfikowany: 12-01-2011, 18:27 przez Ancik.)
Nie rozumiem wogóle w czym tkwi twój problem, skoro odpowiedzi nie było w poście powyżej. Myślałem, że tło umieszczasz w osobnym divie, ale skoro twierdzisz że nie to w czym problem? Przecież tło jest nadawane jako background w css, a nie jako obrazek w postaci <img>, więc w jaki sposób ma niby naruszac szablon strony?
Cytat:Z ciekawości zajrzałem na tą stronę z przykładami. Co to niby ma być ten ostatni przykład?
Chyba ma namieszac w glowie, nie widze innego zastosowania...
Liczba postów: 13
Liczba wątków: 2
Dołączył: 09-01-2011
Reputacja:
0
Umieszczam, nawet w dwóch osobnych, jak w zamieszczonym kodzie. Moje pytanie jest jak zrobic dwukolrowe tło aby nie naruszało szablonu ale było tłem dla szablonu czyli inaczej jeszcze mówiąc pod szablonem....
Jeżeli przytoczona porada jest bez sensu i nie mozna zrobic tła strony na divach to w jaki sposób mozna zrobić tło dwukolrowe...
Liczba postów: 578
Liczba wątków: 11
Dołączył: 06-01-2011
Reputacja:
23
Ffs, powiedz w takim razie konkretnie, o jakie tło ci chodzi? Jeżeli chcesz jako tło jeden pasek poziomy na środku strony i pionowy innego koloru też na środku, to trzeba zastosowac inne rozwiązanie niż to, które opisałem Ci w moim długim poście. Wszystko zależy czego chcesz, nie ma jednej recepty.
Pozdrawiam.
Liczba postów: 13
Liczba wątków: 2
Dołączył: 09-01-2011
Reputacja:
0
Ok, chciałbym wiedziec:
1. jak zrobic dwa paski jeden poziomy, drugi pionowy oba np żółte na czarnym tle, załóżmy że na środku lub przecinajace sie w jakims marginesie od któregos górnego rogu...a na tym szablon strony ułozony pośrodku strony przy samej gorze(bez gornego marginesu)
2. Trojkolorowe tło (trzy poziome pasywypełniające całe okno) których wyskość moglbym ustawiac dowolnie. I na tym szablon strony jak na załączonym wyżej kodzie. (szablon po srodku bez górnego marginesu)
I wszystko to chciałbym miec zdefinioweane w CSS, poniewaz to tło bedzie wykorzystywane dla wszystkich podstron...
dzieki
Liczba postów: 2,411
Liczba wątków: 14
Dołączył: 10-08-2009
Reputacja:
132
Eh. Wciąż te tabelkowe stereotypy 
90% problemów z layoutami spowodowane jest przez stare-tabelkowe podejście. W dzisiejszych czasach nie wystarczy zmienic table na div, ale trzeba zmienic totalnie podejście.
No ale pal licho.
html, body {min-height:100%;}
.div1 {height:30%; overflow:hidden; background:yellow;}
.div2 {height:30%; overflow:hidden; background:red;}
.div3 {height:30%; overflow:hidden; background:blue;}
.content {position:absolute; top:0; left:50%; width:960px; margin:0 -350px; hiehgt:100%; overflow:hidden;}
Pewnie będzie trzeba dodać jeszcze kilka właściwości, ale nie chce mi się teraz tego sprawdzać, bo ani to ładny kod, ani prawidłowy.
Zresztą istnieją właściwości generujące zawartość jakby były tabelkami (table-cell) i wtedy można kombinować. Że niby stosować tabele? Jeżeli w html nie ma złych tabel, to wszystko jest w 100% porządku.
Liczba postów: 578
Liczba wątków: 11
Dołączył: 06-01-2011
Reputacja:
23
Co do twojego drugiego pytania to odpowiedź znajduje się właśnie w moim pierwszym poście. Musisz to po prostu zrozumiec. Tak jak powyżej, trzy divy na wysokośc strony wypełnione różnymi kolorami, a w nich treśc. Ot i całe rozwiązanie. Co do punktu pierwszego, to będzie wyglądalo brzydko na wszystkim, więc porzuc ten pomysł, a jeśli już nie chcesz to rozwiązaniem będzie ustawienie takiego tła jako obrazu w dużej rozdzielczości w znaczniku body (ale przecież to bez sensu).
Pozdrawiam.
|
Podobne wątki… |
Wątek: |
Autor |
Odpowiedzi: |
Wyświetleń: |
Ostatni post |
|
szablon przewijanie na jednej stronie |
klimczok |
9 |
7,733 |
30-04-2016, 13:50
Ostatni post: nurkla
|
|
Smarty, książki oraz Szablon HTML5 |
Morfeusz_2005 |
1 |
2,636 |
18-11-2013, 14:34
Ostatni post: prawdziwypiotrek
|
|
Szablon na bloggera |
Longin |
3 |
3,484 |
26-06-2013, 01:01
Ostatni post: natyl
|
|
Szablon eBay, blokowanie |
zielu3 |
1 |
1,606 |
12-11-2012, 03:00
Ostatni post: kornell
|
|
[CSS?] czemu ten szablon bloggera pogrubia elementy listy? |
Folmi |
1 |
2,262 |
05-09-2012, 20:03
Ostatni post: camelrafal
|
Użytkownicy przeglądający ten wątek: 1 gości
|
|
Sponsorzy i przyjaciele
|
|
|