| Autor | Zpráva | ||
|---|---|---|---|
| Tolike Profil |
Dobrý den, potřeboval bych normální strńky dělane přez html s nějakýma těma menšíma prvkama css převést na css.
Prostě abych mel v css vzhled a v html aby byl jenom text. Stránky vypadají takto. Jak vidíte forma je rámcová, toho bych se taky chtěl zbavit použitím vlastnosti background-repeat. Ale jelikož nejsem autorem originálu, nevyznám se v tom (autorka v tom má největší bordel) a rozhodl jsem se že to udělám od nuly. Aby jste mě správně pochopili tak začnu nový dokument (btw používám dreamweaver) a s originálem si budu ověřovat hodnoty.. 1. krok, který jsem udělal že jsem v css nastavil pozadí body. body {
background:url(patt2.png);
background-repeat:repeat-x repeat-y;
}potom jsem ale narazil na problém: rozdělil jsem původní obrázek (rámec) na 3 části: header, prostřední-opakující se část a footer do style.css jsem zapsal toto #1 {
background-image: url(l2_01.png);
background-position:center top;
background-repeat: no-repeat;
height: 390px;
width: 1059px;
}
#2 {
background-imge: url(l2_02.png);
background-position:center;
background-repeat:repeat-y;
height: 412px;
width: 1059px;
}
#3 {
background-image: url(l2_03.png);
background-position:center bottom;
background-repeat: no-repeat;
height: 167px;
width: 1059px;
}a do html toto <body> <div id="1"></div> <div id="2"></div> <div id="3"></div> </body> ale nejspíš jsem někde udělal chybu, což je pochopitelné protože jsem s tvorbou stránek začal předevčírem, protože obrázky se mi nezobrazí.. Byl bych vám moc vděčný kdyby jste mi poradili jak mam tuto závadu opravit. A kdyby jste mi ještě poradili jak mám postupovat dále tak bych byl nejšťastnějším člověkem na Zemi.. Moderátor Davex: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na
 ). |
||
| Taurus Profil |
#2 · Zasláno: 30. 5. 2010, 12:21:12
A otázka je? Externí css tam navíc vidím. Pokud pak máš někde např.:
<span style="background: #ddd;"> stačí to přepsat na <span class="Nazev-tridy"> a do css napsat .Nazev-tridy {background: #ddd;} |
||
| Tolike Profil |
#3 · Zasláno: 30. 5. 2010, 12:32:26
Taurus:
Teď jsem trochu nerozuměl, ale asi máte na myslím jak bych mohl opravit ten original. Já bych spíš chtěl udělat to celé od začátku a přijít na ten problém proč se mi ty 3 obrázky: header, prostřední a footer nezobrazují. |
||
| Taurus Profil |
#4 · Zasláno: 30. 5. 2010, 12:41:55
Aha, editoval si svůj příspěvek... Třídy nemohou začínat čísly.
|
||
| tiso Profil |
#5 · Zasláno: 30. 5. 2010, 12:43:25
Tolike: problém je tu:
<div id="1"> ID nesmie začínať číslicou! pomenuj si tie divy podľa toho čo predstavujú (header, menu, main), aby si sa v tom potom vyznal. |
||
| Tolike Profil |
#6 · Zasláno: 30. 5. 2010, 12:44:31 · Upravil/a: Tolike
Taurus:
Tiso: Děkuji, to jsem netušil. A jak se jmenuje obrázek který je uprostřed a opakuje se? Header to vím, ten je nahoře. Footer je dole.. |
||
| Taurus Profil |
#7 · Zasláno: 30. 5. 2010, 12:48:41
To je na tobě. Body, content, tělo, střeva, ...
|
||
| Tolike Profil |
#8 · Zasláno: 30. 5. 2010, 12:51:44 · Upravil/a: Tolike
Jo a mužu ještě jednu otázečku? Teď jsem to opravil, ale obrázky nejsou na středu, to se asi nenastavuje v css u obrázku ale v html u divu, že?
|
||
| Taurus Profil |
#9 · Zasláno: 30. 5. 2010, 13:31:53
Obrázky se nastavují v css. Navíc nemusíš psát tři řádky
background-image: url(l2_03.png); background-position:center bottom; background-repeat: no-repeat; ale vše v jednom (background): background: url("obrazek.png") center bottom no-repeat;Protože nevidím živou ukázku, těžko ti budu dál pomáhat, je to jen střílení od boku. Takže vytvoř si v css třídu #obal {margin: 0px auto} |
||
| Tolike Profil |
#10 · Zasláno: 30. 5. 2010, 13:55:56 · Upravil/a: Tolike
Děkuji.
Už jsem přišel na to proč se ten prostřední nezobrazuje- do css jsem napsal backround-imge tz. vynechal jsem písmeno "a" Ten #obal mi nějak nešl, ale inspiroval jste mne a všechny 3 obrázky jsem dal do jednoho divu a tomu jsem dal hodnotu align=center.. A to s tím nahráním na web, mám Vám poslat kod do příspěvku nebo uploadovat soubory index.html a style.css třeba na rapid share? |
||
| Railbot Profil |
#11 · Zasláno: 30. 5. 2010, 14:08:44
Tolike:
„a tomu jsem dal hodnotu align=center“ Psal jsi, že chceš využívat CSS, tak HTML tagům necpi žádné zbytečné atributy. To stejné lze udělat v CSS, když tomu divu dáš text-align:center „to s tím nahráním na web, mám Vám poslat kod do příspěvku nebo uploadovat soubory index.html a style.css třeba na rapid share?“ Taurus tím myslel živou ukázku, tedy stránky nahrané na nějaký hosting, ani kód do příspěvku a už vůbec ne web nahraný na rapidu, to nikdo stahovat nebude. |
||
| Tolike Profil |
#12 · Zasláno: 30. 5. 2010, 14:17:39
Omluvte mě prosím, pokud jsem vás vytočil, opravdu jsem to neměl v planu..
Když dám obrázky do #obal {margin: 0px auto} tak se to zase posune doleva! "živá ukázka" : http://crashtest.okamzite.eu/ (ukázka je s align=center, tže pokud budete chtít můžu tam dát css řešeni který mi ale nešlo) |
||
| tiso Profil |
#13 · Zasláno: 30. 5. 2010, 14:30:14
Tolike: tomu centrovaniu sa dá pomôcť takto: http://tiso.wz.cz/articles/vycentrovanie-obsahu-stranky.php
|
||
| Tolike Profil |
#14 · Zasláno: 30. 5. 2010, 14:39:22
Tak jsem to asi někde pokálel, přísahám že to zase bude všechno vlevo když dám do css:
body { background:url(patt2.png); } #obal { margin: 0 auto; } #header { background-image:url(l2_01.png); background-position:center top; background-repeat:no-repeat; height: 390px; width: 1059px; } #repeater { background-image:url(l2_02.png); background-position:center; background-repeat:no-repeat; height: 412px; width: 1059px; } #footer { background-image:url(l2_03.png); background-position:center bottom; background-repeat:no-repeat; height: 167px; width: 1059px; } a do html: <body> <div id="obal"> <div id="header"></div> <div id="repeater"></div> <div id="footer"></div> </div> </body> |
||
| panther Profil |
#15 · Zasláno: 30. 5. 2010, 14:40:54
Tolike:
„přísahám že to zase bude všechno vlevo když dám do css:“ zkoušel jsi to? Myslím, že ne, v kódu chyba není a musí to být vycentrované. Nedávej sem desítky řádků kódu, ale vše někam nahraj na hosting a dej sem odkaz. |
||
| Tolike Profil |
#16 · Zasláno: 30. 5. 2010, 14:43:38
panther:
promeň, a kam třeba? |
||
| panther Profil |
#17 · Zasláno: 30. 5. 2010, 14:44:01
Tolike:
wz.cz, ic.cz, kamkoliv. |
||
| Tolike Profil |
#18 · Zasláno: 30. 5. 2010, 14:46:05
panther:
ale to pak bude ten živý nájled jak mě už prosil Taurus, ne? Já vám chtěl ukázat kód.. |
||
| Tolike Profil |
#19 · Zasláno: 30. 5. 2010, 14:50:29
|
||
| panther Profil |
#20 · Zasláno: 30. 5. 2010, 14:52:45
Tolike:
„ale to pak bude ten živý nájled jak mě už prosil Taurus, ne?“ omlouvám se, ten odkaz jsem přehlédl. „Já vám chtěl ukázat kód..“ kód si každý zobrazí sám. V uvedeném odkazu nevidím kód uvedený v [#14], který musí fungovat a o kterém tvrdíš opak. |
||
| Tolike Profil |
#21 · Zasláno: 30. 5. 2010, 14:57:30 · Upravil/a: Tolike
panther:
no jo, já ho zapomněl uložit, ale teď už tam je a stále to nejde.. |
||
| panther Profil |
#22 · Zasláno: 30. 5. 2010, 15:00:21
Tolike:
margin: 0 auto, resp. margin: auto ten blok vycentruje. Div je od přírody blokvý a má tedy šířku 100% (centruješ blok o šířce 100%, pozice na středu se tedy rovná pozici vlevo a ta se rovná pozici vpravo). Přidej šířku, kterou potřebuješ. |
||
| Tolike Profil |
#23 · Zasláno: 30. 5. 2010, 15:06:06
panther:
přidal jsem pod margin width:1059 a žádná změna se nekonala já už jsem z toho zoufalej.. |
||
| Tolike Profil |
#24 · Zasláno: 30. 5. 2010, 15:07:39 · Upravil/a: Tolike
aha, ja jsem zapomněl na pixely :D už to jde..
moc děkuju! |
||
| panther Profil |
#25 · Zasláno: 30. 5. 2010, 15:11:16
Tolike:
„přidal jsem pod margin width:1059 a žádná změna se nekonala“ můsíš refreshovat stránku. Teď je celý obsah vycentrovaný. |
||
| Tolike Profil |
#26 · Zasláno: 30. 5. 2010, 15:18:41 · Upravil/a: Tolike
panther, tiso, Railbot, Taurus:
Děkuju všem převelice, teď už předpokládám že mi zbývá dodělat menu a samotný obsah (každy do vlastního oddílu a pak ještě jeden oddíl pro statistiku).. |
||
| Taurus Profil |
#27 · Zasláno: 30. 5. 2010, 16:00:04
Eh, omlouvám se, kdybych nezapomněl poradit šířku, ušetřil bych všem čas...
|
||
|
Časová prodleva: 14 let
|
|||
0