Pomoc przy robieniu strony - pocięty layout
Autor
Wiadomość
michone
Dołączył: 16 Paź 2007 Posty: 2045 Skąd: Legnica
Wysłany: Pią Lut 13, 2009 17:18 Pomoc przy robieniu strony - pocięty layout
Mam pociety layout na divach :
Kod: <html>
<head>
<title>BLUE2</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<style type="text/css">
<!--
#Table_01 {
position:absolute;
left:0px;
top:0px;
width:1024px;
height:1024px;
}
#BLUE3-01 {
position:absolute;
left:0px;
top:0px;
width:1024px;
height:215px;
}
#BLUE3-02 {
position:absolute;
left:0px;
top:215px;
width:32px;
height:809px;
}
#BLUE3-03 {
position:absolute;
left:32px;
top:215px;
width:216px;
height:451px;
}
#BLUE3-04 {
position:absolute;
left:248px;
top:215px;
width:47px;
height:809px;
}
#BLUE3-05 {
position:absolute;
left:295px;
top:215px;
width:474px;
height:786px;
}
#BLUE3-06 {
position:absolute;
left:769px;
top:215px;
width:32px;
height:809px;
}
#BLUE3-07 {
position:absolute;
left:801px;
top:215px;
width:189px;
height:450px;
}
#BLUE3-08 {
position:absolute;
left:990px;
top:215px;
width:34px;
height:809px;
}
#BLUE3-09 {
position:absolute;
left:801px;
top:665px;
width:189px;
height:359px;
}
#BLUE3-10 {
position:absolute;
left:32px;
top:666px;
width:216px;
height:358px;
}
#BLUE3-11 {
position:absolute;
left:295px;
top:1001px;
width:474px;
height:23px;
}
-->
</style>
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<div id="Table_01">
<div id="BLUE3-01">
<img scr="images/BLUE2_01.gif" width="1024" height="215" alt="">
</div>
<div id="BLUE3-02">
<img src="images/BLUE3_02.gif" width="32" height="809" alt="">
</div>
<div id="BLUE3-03">
<img src="images/BLUE3_03.gif" width="216" height="451" alt="">
</div>
<div id="BLUE3-04">
<img src="images/BLUE3_04.gif" width="47" height="809" alt="">
</div>
<div id="BLUE3-05">
<img src="images/BLUE3_05.gif" width="474" height="786" alt="">
</div>
<div id="BLUE3-06">
<img src="images/BLUE3_06.gif" width="32" height="809" alt="">
</div>
<div id="BLUE3-07">
<img src="images/BLUE3_07.gif" width="189" height="450" alt="">
</div>
<div id="BLUE3-08">
<img src="images/BLUE3_08.gif" width="34" height="809" alt="">
</div>
<div id="BLUE3-09">
<img src="images/BLUE3_09.gif" width="189" height="359" alt="">
</div>
<div id="BLUE3-10">
<img src="images/BLUE3_10.gif" width="216" height="358" alt="">
</div>
<div id="BLUE3-11">
<img src="images/BLUE3_11.gif" width="474" height="23" alt="">
</div>
</div>
</body>
</html>
pytnia:
jak zrobic nie uzywajac marginesow tak aby calosc byla wysrodkowana??
_________________ Sentyment do r200 silverstone pozostanie na zawsze...
SPAMU¦
Wysłany: Pią Lut 13, 2009 17:18 Post o charakterze reklamowym. Każde Twoje kliknięcie zwiększa nasze szanse przeżycia ;)
damiwr
Dołączył: 11 Lis 2008 Posty: 575 Skąd: Mińsk Mazowiecki
Wysłany: Pią Lut 13, 2009 21:04
position:absolute; w pierwszej tabelce to chyba nieporozumienie
może należy tabelkę nr 1. tak :
<DIV ALIGN="center" ID="Table_01">
tylko ze jak jest abslute przypisane w css to nie pójdzie za nic.
nie łatwiej zrobić jedną główną na 600 wyśrodkować a resztę css dać już do niej do środka
[ Dodano : Pią Lut 13, 2009 21:08 ]
naszło mnie jeszcze jedno dlaczego tabelka 1 ma służyć jako tło
skoro resztą tabelek ją zasłaniasz no i ... one też mają absolute więc nawet jak wyśrodkujesz tło to reszta pozostanie na swoim miejscu
_________________.: Podpis użytkownika wymaga
edycji :.
michone
Dołączył: 16 Paź 2007 Posty: 2045 Skąd: Legnica
Wysłany: Sob Lut 14, 2009 08:27
ale tabela 1 nie jest jako tlo.
Cytat: nie łatwiej zrobić jedną główną na 600 wyśrodkować a resztę css dać już do niej do środka
jak?
_________________ Sentyment do r200 silverstone pozostanie na zawsze...
b0b3k
Dołączył: 27 Paź 2008 Posty: 210 Skąd: Sosnowiec
Wysłany: Sob Lut 14, 2009 09:41
damiwr napisał/a:
<DIV ALIGN="center" ID="Table_01">
align? juz lepiej wszystko w stylach srodkowac a nei mix mode pozatym autor tematu chyba to ciął jakims imageready - obrazki tez sie da jako tło diva ustawic i sztywno wartość
ps jak przyjdzie Ci szukac jakiegos diva to po tych numerkach ciezko bedzie lepiej inaczej nazywac
damiwr
Dołączył: 11 Lis 2008 Posty: 575 Skąd: Mińsk Mazowiecki
Wysłany: Sob Lut 14, 2009 10:55
Cytat: jak?
najprościej w body wpisać tabelkę o jakąś wartości szerokości i ją wyśrodkować a resztę w nią wpisać ale to tak jak piszę kolega wyżej mieszanie stylów więc najlepiej jest zrobić od nowa lub porobić te tabelki ale nie na absolute.
Cytat: align? juz lepiej wszystko w stylach srodkowac a nei mix mode
tak najprościej ale jak masz szerokość 1024 a ekran 800 x 600
_________________.: Podpis użytkownika wymaga
edycji :.
michone
Dołączył: 16 Paź 2007 Posty: 2045 Skąd: Legnica
Wysłany: Sob Lut 14, 2009 12:43
dalem grafike jako tlo:
Kod: <html>
<head>
<title>BLUE2</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<style type="text/css">
<!--
#Table_01 {
position:absolute;
left:0px;
top:0px;
width:1024px;
height:1024px;
}
#BLUE3-01 {
position:absolute;
left:0px;
top:0px;
width:1024px;
height:215px;
background-image: url(images/BLUE3_01.gif);
}
#BLUE3-02 {
position:absolute;
left:0px;
top:215px;
width:32px;
height:809px;
background-image: url(images/BLUE3_02.gif);
}
#BLUE3-03 {
position:absolute;
left:32px;
top:215px;
width:216px;
height:451px;
background-image: url(images/BLUE3_03.gif);
}
#BLUE3-04 {
position:absolute;
left:248px;
top:215px;
width:47px;
height:809px;
background-image: url(images/BLUE3_04.gif);
}
#BLUE3-05 {
position:absolute;
left:295px;
top:215px;
width:474px;
height:786px;
background-image: url(images/BLUE3_05.gif);
}
#BLUE3-06 {
position:absolute;
left:769px;
top:215px;
width:32px;
height:809px;
background-image: url(images/BLUE3_06.gif);
}
#BLUE3-07 {
position:absolute;
left:801px;
top:215px;
width:189px;
height:450px;
background-image: url(images/BLUE3_07.gif);
}
#BLUE3-08 {
position:absolute;
left:990px;
top:215px;
width:34px;
height:809px;
background-image: url(images/BLUE3_08.gif);
}
#BLUE3-09 {
position:absolute;
left:801px;
top:665px;
width:189px;
height:359px;
background-image: url(images/BLUE3_09.gif);
}
#BLUE3-10 {
position:absolute;
left:32px;
top:666px;
width:216px;
height:358px;
background-image: url(images/BLUE3_10.gif);
}
#BLUE3-11 {
position:absolute;
left:295px;
top:1001px;
width:474px;
height:23px;
background-image: url(images/BLUE3_11.gif);
}
-->
</style>
</head>
<body style="background-color:#FFFFFF; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;">
<div id="Table_01">
<div id="BLUE3-01">
</div>
<div id="BLUE3-02">
</div>
<div id="BLUE3-03">
</div>
<div id="BLUE3-04">
</div>
<div id="BLUE3-05">
</div>
<div id="BLUE3-06">
</div>
<div id="BLUE3-07">
</div>
<div id="BLUE3-08">
</div>
<div id="BLUE3-09">
</div>
<div id="BLUE3-10">
</div>
<div id="BLUE3-11">
</div>
</div>
</body>
</html>
Cielem to imageready udalo sie na divach bo na tabelach byly strazne krzaki.
Jak zrobic wyciagnac styl css do pliku i jak go pozniej uzyc w stronie??
_________________ Sentyment do r200 silverstone pozostanie na zawsze...
damiwr
Dołączył: 11 Lis 2008 Posty: 575 Skąd: Mińsk Mazowiecki
Wysłany: Sob Lut 14, 2009 17:27
michone , Jak zrobic wyciagnac styl css do pliku i jak go pozniej uzyc w stronie??
wyciągasz i wklejasz do dokumentu txt zapisujesz go jako style.css i w odnośniku na górze nie piszesz text/css tylko odnośnik do pliku
_________________.: Podpis użytkownika wymaga
edycji :.
escatox
Dołączył: 12 Paź 2008 Posty: 169 Skąd: Wrocław Rover 200
Wysłany: Sob Lut 14, 2009 18:04
michone napisał/a: Jak zrobic wyciagnac styl css do pliku i jak go pozniej uzyc w stronie??
To co masz w sekcji <style></style> kopiujesz do pliku notatnika i zapisujesz jako style.css
Natomiast w dokumencie strony między </title> a </head> wstawiasz taki kod:
Kod: <link href="style.css" rel="stylesheet" type="text/css" />
Styl <body> też sobie wyciągnij do style.css