Havi horoszkóp

Ezt a kiadványt szeretnénk elkészíteni (célszerű a leírás sorrendjében haladni):

Használjunk stílusokat, de ezt a HTML fájl fejrészében (HEAD) helyezzük el:
<style>
...
</style>
!

A megvalósítás ötlete (középső részre)

• az egész majd egy három soros, négy oszlopos táblázat lesz
• egy cellát - egy horoszkópképet és horoszkópszöveget szépen, formázva elkészítünk (pl. a Kos)
• ezt a kész cellát másoljuk háromszor ugyanebbe a sorba, majd cseréljük a képeket és szövegeket
• s (ha még van kedvünk) ezt a kész sort másoljuk kétszer, majd cseréljük a képeket és szövegeket

Adatok (szöveg, képek)

Itt található a kiadvány szövege: katt ide (04_nyers.txt)

Itt a benne lévő képek: Bak Bika Halak Ikrek Kos Mérleg Nyilas Oroszlán Rák Skorpió Szűz Vízöntő

Lépések

• Készítsük el a horoszkop.html vázát, főcímét, táblázatát (csak egy cellát!!!) és az alsó linket!
• Az egész lap stílusai: 1000px széles, 10px kitöltés (mind a négy oldalon, Arial betűtípus és "border:1px solid gray;" szegély.
• A tábla stílusai: "border-collapse: collapse;" (összevonja a szomszédos cellák szegélyeit)
• A cella stílusai: szélessége 25% (a tábla negyede), "vertical-align:top;" (függőlegesen felfelé igazítjuk), "border:1px dashed red;" (szaggatott piros vonal a szegély), 16px kitöltés
• A cellatartalom:
  kép stílusai: "float:left;" (ennek hatására a kép balra kerül, s "körülfollya" a szöveg), 70px széles, 5px kitöltés legyen a jobb oldalán (hogy ne ragadjon hozzá a szöveg)
  címsor jellemzői: H2-es, 16px betűméret, két sorba törve
  bekezdés stílusai: 14px betű, sortáv 20px és sorkizárt
• Ha szép a cella, másolgathatunk!
• A főcím (H1) és az alsó link formázását a kép alapján végezzük!

Javaslat

• Valószínű, hogy a szöveg sorkizárt volta miatt bizonyos hosszú szavak közt nagy szóközök maradnak. Ezt egy jó helyre tett elválasztójellel "–" lehet javítani.