Československá literární komunita

Tak jako generace autorů před vámi, publikujte svoji psanou tvorbu. Podělte se o svoje názory a sbírejte zpětnou vazbu na svoje díla. Inspirujte se a učte od nejlepších.

Přidejte se

HTML pro BLONDÝNKY - 3. lekce

Výběr: Lyryk
16. 10. 2002
5
0
7028
Autor
Petula

LEKCE III. - ČÁRY A ZAROVNÁNÍ




Čáry


Ke členění textu lze použít vodorovnou (HORIZONTÁLNÍ) čáru:

Kýženého efektu docílíme HTML zápisem: <HR>


Pokud chceme čáru obarvit, doplníme do TAGu HR vlastnost pro barvičku, například červenou:

HTML zápis: <HR COLOR=RED>


Čára nemusí být přes celé okno. Její délku lze nastavit.
Nastavení může být buď v pixelech (obrazových bodech), to jest uvedením konkrétního čísla, třeba 300, nebo v procentech, to jest za číslo uvedeme znak %. Rozsah je 1%100%, mezní hodnoty jsou ale celkem k ničemu.
Vřele doporučuji nastavovat šíři čáry v procentech!
Tímto relativním určením velikosti docílíme vždy kýženého efektu, a to bez ohledu na aktuální velikost okna a grafické rozlišení monitoru...
Zde je čára dlouhá 1/2 šíře aktuálního okna.
Pokud budete okno rozšiřovat či zužovat, čára bude vždy v délce jeho poloviny - svou délku bude měnit se změnami šířky okna:
HTML zápis: <HR WIDTH=50%>


Abychom měli jistotu, kam se čára, která není dlouhá přes celou šíři okna, zarovná, je dobré použít příkaz k úpravě vlastnosti zarovnání. Zde je čára umístěna vpravo:
HTML zápis: <HR ALIGN=RIGHT WIDTH=50%>

Další parametry vlastnosti zarovnání jsou:

Na střed:
HTML zápis: <HR ALIGN=CENTER WIDTH=50%>

Vlevo:
HTML zápis: <HR ALIGN=LEFT WIDTH=50%>


Čáře také můžeme nastavit její výšku (tloušťku), a to jen v pixelech:
HTML zápis: <HR ALIGN=CENTER WIDTH=50% SIZE=25>


Můžeme odstranit stínování:
HTML zápis: <HR ALIGN=CENTER WIDTH=50% SIZE=25 NOSHADE>


Můžeme dodat barvu (odstraňování stínování nebývá potřebné):
HTML zápis: <HR ALIGN=CENTER WIDTH=50% SIZE=25 COLOR=BLUE>


Poznámka: Normálně se čára, která není přes celou šíři okna, zarovnává na střed. Na Písmáku se však zarovnává vlevo a proto je vždy radno uvádět vlastnost ALIGN a její požadovaný parametr.




Zarovnání odstavce


Když umíme zarovnat čáru, umíme zarovnat i odstavec.


Text VPRAVO.

HTML zápis: <P ALIGN=RIGHT>Text VPRAVO.</P>


Text UPROSTŘED.

HTML zápis: <P ALIGN=CENTER>Text UPROSTŘED.</P>


Text VLEVO.

HTML zápis: <P ALIGN=LEFT>Text VLEVO.</P>

Ano, používám zde nový TAG, a to TAG P. Označuje odstavec a případně mu může dávat vlastnost zarovnání. Jak vidíte, pomocí vlastnosti ALIGN TAGu P, která má parametry LEFT / CENTER / RIGHT (LEFT je předpokládaná hodnota, když nenapíšeme nic) řídíme umístění textu k levé straně, na střed, či k pravé straně okna.

TAG P je v podstatě TAGem párovým, ale běžně se používá jako nepárový, protože jeho nové použití ruší jeho předchozí nastavení. Nicméně protože jsem bordelářka, používám i jeho uzavření, abych viděla hranice a nekřížila přes jednotlivé TAGy P třeba barvu či styl písma… Uzavření TAGu P nedělá nic jiného, než že otevře další odstavec, tedy jako když dáte znovu počáteční TAG P. Při použití tohoto TAGu se také obvykle odsadí text o jeden řádek.




Zarovnání nadpisů


Vlastnost ALIGN též můžeme použít u nadpisů, a to naprosto stejně jako u odstavců.


Nadpis VPRAVO

HTML zápis: <H4 ALIGN=RIGHT>Nadpis VPRAVO</H4>


Nadpis UPROSTŘED

HTML zápis: <H4 ALIGN=CENTER>Nadpis UPROSTŘED</H4>


Nadpis VLEVO

HTML zápis: <H4 ALIGN=LEFT>Nadpis VLEVO</H4>




Děkuji za pozornost!

Vaše Petula
|||~_~||| Čarodějnice


V příští lekci si povíme něco o možnostech neproporcionálního písma a předformátovaného textu - tedy cestě k vyřešení jinak obtížného vkládání více mezer do textu.
Nebo o vkládání pohyblivého textu.
Nebo o tabulkách - do kterých lze mj. vkládat obrázky.
Nebo o vkládání odkazů na stránky a na obrázky - podle toho, jak budete chtít…

Tak...

 

Doufám, že ze se vám to zobrazuje dobře...

 

Ne-li, tak se ozvěte a dám kopii někam na web... :o)

 

|||-_-|||



Petula
02. 09. 2004
Dát tip
Ne, novějším prohlížečům je to jedno, zda uvozovky jsou či ne, ale musejí důsledně být či nebýt a pokud jsou, tak na správném místě! Obrázek se nezobrazil nikoliv kvůli uvozovkám, ale kvůli chybně uvedeným uvozovkám - na špatním místě. Máš je v části adresy: http://"www.oa.svitavy.cz/pro/renata/priroda/priroda1/ptactvo/z8b27/divok.htm/new-1.jpg" Navíc máš špatně adresu: http://www.oa.svitavy.cz/pro/renata/priroda/priroda1/ptactvo/z8b27/divok.htm/new-1.jpg (Červeně je označeno, co je chybně.)
|||-_-|||

Petula
31. 08. 2004
Dát tip
Ahoj ►bluegrasshopper◄ Tak nevím, kontrolovala jsem na netu „vzor“, a nikde chybu nevidím… Můžeš, prosím, uvést přesněji, ať to mohu opravit? Nebo tam chyba není? Díky!
|||-_-|||

Petula
20. 08. 2004
Dát tip
Hej, bgs…, to je jako co? Měla se snad zobrazovat kachna? Máš tam chybně uvozovky a také adresa není (na konci) přesná! Ale nakonec mi to spadlo, takže jsem Ti ji nezkopírovala… :o(
|||-_-|||

Petula
29. 06. 2004
Dát tip
Solitary ◄ Barva pozadí nastavit lze, ale je to složitější. Dá se to udělat například tabulkou… Někam jsem to i dávala jako kritiku, když jsem byla rozezlená…
|||-_-|||

Solitary
29. 06. 2004
Dát tip
Aha..tak na to už nestačím. Vzhledem k četnosti tohodle způsobu zvýraznění jsem myslela, že je to jednodušší :) Ale i tak děkuji za všechny lekce, teď jdu někam "machrovat" :o)))

Solitary
14. 06. 2004
Dát tip
Tak to teda jsem zvědavá, co mi vyjde...
Solitary
14. 06. 2004
Dát tip
no nevyšlo to tak jak jsem chtěla...

Solitary
14. 06. 2004
Dát tip
A proč tu nejde nastavit barva pozadí?? V poznámkovém bloku to jde..

na idem to skusit ;)

JOJ ONO TO FUNGUJE!!! ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆ ☆

Petula
14. 02. 2003
Dát tip
Nojo, máš recht!

|||-_-|||
«|DODÁM|»


Petula
14. 02. 2003
Dát tip
Aha, takže poslední možnost z výše uváděné nabídky na konci této lekce! Tak třeba tohle? (To jsem žádostivá, zda to bude fachčit!!!)
 Klikni si na obrázek…

  Klikej na obrázky…

Petula
14. 02. 2003
Dát tip
JohnieBass - tady!
|||-_-|||

alina
13. 02. 2003
Dát tip
Petulííííííííííííííííííííííííííííííííííííííí .......dypa bude další vyučovací hodina???? .........si přecivá slibovala.....fňuk ...... ;)) Koukám že fšickni tu uměj jezdící písmenka .....ke mně tohle kouzlo nedorazilo :o(( Potom bych chtěla umět kouzlit s vobrázkama :o). Takový to, jako že někde čapneš a ukradneš nějakej vobrázek - to je jedno kde - a pak ho vložíš buďto do zpráviček, nebo přímo do kritik pod dílko A pak taky takovej ten "samoklikací" odkaz,prostě, co na něj jde rovnou kliknout aniž bys ho musela někam kopírovat ....bych chtěla umět ..... ......síííííííím, síííííííííím, pančelkooooo.........!!!!!!......kujuuu ;)) *o*

cvok
04. 12. 2002
Dát tip
pokus

cvok
04. 12. 2002
Dát tip
pokus

cvok
04. 12. 2002
Dát tip
diky Petula!

hurvinek
26. 11. 2002
Dát tip
Petulo, dekuju co se pocitacu tyce jsem malinke batole a tenhle kurs je tak na me technicke urovni snadno pochopitelny a user friendly

hurvinek
25. 11. 2002
Dát tip
vadi ze nejsem ani blondyna ani zena? rozhodne tohle se mi hodi

Petula
25. 11. 2002
Dát tip
Hurvínku, ne, nevadí! Nejsem ani militantní feministka (jen feministka teoretička), ani rasistka (snáším i odbarvené brunety!). :o) Děkuji!
|||-_-|||

FARAMIR
18. 11. 2002
Dát tip

Text do bloku udělat jen tak jednoduše nejde (nebo o tom alespon nic nevím…) Je to složitější problém, protože to bys pak musela ošetřit i dělení slov!!! Dříve, když začaly textové procesory (včetně slavné i proklínané T602), byli z této jejich možnosti všichni „auf“ a skoro se ani jiné formátování textu nepoužívalo. Bylo to „in“. Nyní se způsob formátování do bloku používá zase už jen, tam, kde je to vhodné (a snadné). Celou věc jde v HTML obejít netriviální úpravou textu mimo prstředky HTML a do stráneik jej vložit jako předformátovaný text či jako dokument… To je ale pro nás – blondýnky – dost náročné a tím se my nezabýváme… Pokud má někdo nějaký tip na „snadné“ řešení, pak sem s ním.


FARAMIR
18. 11. 2002
Dát tip
RIESENIE: POUZIT ZAROVNANIE DO BLOKU <P ALIGN="JUSTIFY"&Rt;TEXT ODSTAVCA</P">

FARAMIR
18. 11. 2002
Dát tip
Oooops... Chybycka se vloudi...Takze oprava: ZAROVNANIE DO BLOKU :: JUSTIFY <P ALIGN="JUSTIFY">

TEXT ODSTAVCA zarovnaneho do bloku. Bez delenia slov! Predlozky a&nbs;spojky je potrebne zviazat z nasledujucim slovom pomocou tvrdej medzery

</P">

Petula
18. 11. 2002
Dát tip
FARAMIR :o) Děkuji! No, to je právě to. Dělení a formátování… Jojo, snad časem bude dalš dílek… Tak tam se můžžu na Tvé téma „trochu rozepsat“. Díky!
|||-_-|||

Borec
22. 10. 2002
Dát tip
Tak tohle je:

Petula
21. 10. 2002
Dát tip
blbjenko!!! :o) ► Znak pevné mezery: &nbsp; jsme si ukázali v předchozí lekci… Když jej dáš za jednopísmenkové předložky místo běžné mezery, pak se vždy zalamují správně, tj. jsou na novém řádku a nikoliv na konci předchozího. Text do bloku udělat jen tak jednoduše nejde (nebo o tom alespon nic nevím…) Je to složitější problém, protože to bys pak musela ošetřit i dělení slov!!! Dříve, když začaly textové procesory (včetně slavné i proklínané T602), byli z této jejich možnosti všichni „auf“ a skoro se ani jiné formátování textu nepoužívalo. Bylo to „in“. Nyní se způsob formátování do bloku používá zase už jen, tam, kde je to vhodné (a snadné). Celou věc jde v HTML obejít netriviální úpravou textu mimo prstředky HTML a do stráneik jej vložit jako předformátovaný text či jako dokument… To je ale pro nás – blondýnky – dost náročné a tím se my nezabýváme… Pokud má někdo nějaký tip na „snadné“ řešení, pak sem s ním.
|||-_-|||

blbjenka
18. 10. 2002
Dát tip
no jo, Petí, pjekný, ale zrzounoj to zas nestačí :o)) páč nám ve škole řikali, že když má test vypadat "na úrovni", zarovnává se do bloku. a ještě lepší je zaonačit, aby na koncích řádků nezůstávaly jednopísmenkový předložky, spojky a tak. což nevim, jak se dá, když ten text se v každym prohlížeči rozřádkuje jinak. nevíš, please?

skromna
16. 10. 2002
Dát tip
no vida..tak tohle jsem potřebovala v poledne...:-))

skromna
16. 10. 2002
Dát tip
tralala tak i už i čárkovat dovedu..Petulko díky :-)

Danny
16. 10. 2002
Dát tip
*

dablik008
16. 10. 2002
Dát tip
ja sice nebyt blondyna, ale cetla te pozorne ;o)))

Krel
16. 10. 2002
Dát tip
!!!* super..

panebože... stahuju!! studuju!! praktikuju!! děkuju... .-)

Petula
16. 10. 2002
Dát tip
Děkuju…

Whelp
15. 10. 2002
Dát tip
Já chcu pokračování!! Ňaf ňaf! :o)))

Bacil
15. 10. 2002
Dát tip
:-)

Armand
15. 10. 2002
Dát tip
* .-)

Albireo
15. 10. 2002
Dát tip
Bezvadně zpracované. TIP

alina
15. 10. 2002
Dát tip
Teda, Petulíí, koukám, že je to se mnou horší, než když jsem už asi po stopadesátý začala s angličtinou :o)). V angl. jsem to začínala flinkat a plavat v ní až tak kolem pátý lekce .... Tady už jsem nějak ve skluzu od lekce druhé ... :) Nebylo by - protekčně - nějaké soukromé doučování??? ;o)) *o*

Na psaní názorů musíte mít ověřený email.
Sdílení

© Dobrý spolek

Nahoru