Sisu

• Sammud
• Meetod 1 /2: HTML 4.01 töötamine
• Meetod 2/2: töö CSS / HTML5 -ga

See artikkel näitab teile, kuidas HTML -i horisontaaljoont lisada. Horisontaaljoont saab kasutada saidi sisu eraldamiseks. Rea loomise kood on üsna lihtne. HTML 4.01 -s on aga võimalik sisekäske kasutades rea kujundust muuta. HTML5 -s peate rea kujundamiseks kasutama CSS -i.

Sammud

Meetod 1 /2: HTML 4.01 töötamine

1. 1 Avage olemasolev või looge uus HTML -dokument. HTML -dokumente saab redigeerida tekstiredaktori (nt Notepad) või spetsiaalse koodiredaktori (nt Adobe Dreamweaver) abil. HTML -dokumendi avamiseks valitud programmis toimige järgmiselt.
   • Avage Notepad või mõni muu teksti- / koodiredaktor.
   • Avage menüü Fail.
   • Kliki Avatud.
   • Valige HTML -fail.
   • Kliki Avatud
2. 2 Valige koht, kuhu soovite rea sisestada. Kerige allapoole, kuni leiate rea, mille kohal rida peaks ilmuma, ja seejärel liigutage kursor selle rea algusesse, klõpsates selle rea vasakus servas.
3. 3 Lisage tühi rida. Topeltkoputus Sisestage, et liikuda allapoole teksti, mille ette soovite rida lisada, ja seejärel asetada kursor tühjale reale.
4. 4 Lisa silt hr>. Sisenema hr> rea alguses olevale tühjale kohale. Silt hr> võimaldab joonistada horisontaalse joone kogu lehele.
5. 5 Liigutage kursor märgendi "hr" järel uuele reale, vajutades Sisestage. Nüüd silt hr> peaks olema eraldi real.
6. 6 Lisage atribuudid horisontaaljoonele (valikuline). Lisage selliseid atribuute nagu pikkus, paksus, värv ja joondus. Pange need kohe pärast tunde lokkis traksidesse. Mitme atribuudi lisamiseks eraldage need tühikuga.
   • Sisenema hr size = "#">joone paksuse muutmiseks. Asendage "#" paksuse numbrilise väärtusega (näiteks suurus = "10").
   • Sisenema hr width = "#">joone laiuse muutmiseks. Asendage "#" pikslite arvu või lehe laiuse protsendiga (näiteks laius = "200" või laius = "75%").
   • Sisenema hr color = "#">joone värvi muutmiseks. Asendage "#" värvi nimega või selle kuueteistkümnendkoodiga (näiteks värv = "punane" või värv = "# FF0000").
   • Sisenema hr align = "#">joone joondamiseks. Asenda "#" sõnaga "parem" (parem), "vasak" (vasak) või "keskel" (keskel) (näiteks hr width = "50%" align = "center">).
7. 7 Salvestage HTML -fail. Tekstifaili salvestamiseks HTML -dokumendina peate muutma faililaiendi (.txt, .docx) väärtuseks ".html". HTML -dokumendi salvestamiseks toimige järgmiselt.
   • Avage menüü Fail.
   • Kliki Salvesta kui.
   • Sisestage väljale Faili nimi faili nimi.
   • Lisama .html pärast failinime.
   • Kliki Salvesta.
8. 8 Kontrollige oma HTML -dokumenti. HTML-faili kontrollimiseks paremklõpsake seda ja valige Ava koos. Seejärel valige oma veebibrauser. Sinna, kuhu sisestasite märgendi „hr”, peaks ilmuma pidev joon. HTML -kood näeb välja umbes selline:

   ! DOCTYPE html> html> body> h1> Heading / h1> hr size = "6" width = "50%" align = "left" color = "green"> p1> See rida tuleks pealkirjast eraldada reaga . / P1> / body> / html>

Meetod 2/2: töö CSS / HTML5 -ga

1. 1 Avage olemasolev või looge uus HTML -dokument. HTML -dokumente saab redigeerida tekstiredaktori (nt Notepad) või spetsiaalse koodiredaktori (nt Adobe Dreamweaver) abil. HTML -dokumendi avamiseks valitud programmis toimige järgmiselt.
   • Avage Notepad või mõni muu teksti- / koodiredaktor.
   • Avage menüü Fail.
   • Kliki Avatud.
   • Valige HTML -fail.
   • Kliki Avatud
2. 2 Lisage oma HTML -dokumendile pealkiri. Kui teie HTML -dokumendil pole veel pealkirja, järgige selle lisamiseks neid samme. Pealkiri peab minema märgendi html> järele ja enne keha> silti.
   • Sisenema pea> dokumendi ülaosas.
   • Topeltkoputus Sisestagelisada kaks uut rida.
   • Sisenema / pea>pealkirja sulgemiseks.
3. 3 Sisenema stiili tüüp = "text / css"> päise sees. Stiilimärk paigutatakse kahe pealkirja sildi vahele, et luua koht, kus saate CSS -i abil HTML -i kujundust muuta.
   • Teise võimalusena võite kasutada välist stiililehte. Loe artiklit "Kuidas sisestada CSS -fail HTML -i»Et õppida, kuidas linkida väline CSS -fail HTML -failiga.
4. 4 Sisenema hr {. See on horisontaaljoone kujundamiseks mõeldud CSS -silt. Lisage see päise või välise CSS -faili märgendi „style” järele.
5. 5 Lisage märgendile hr> CSS -stiilid. Need peavad tulema märgendi "hr {" järel. Horisontaaljoont saab kujundada mitmel viisil. Allpool on mõned neist.
   • Sisenema laius: ## px;joone laiuse reguleerimiseks. Asenda "##" joone laiusega pikslites. Pikslite (px) asemel võite kasutada protsenti (%).
   • Sisenema kõrgus: ## px;joone kaalu reguleerimiseks. Asenda "##" joone laiusega pikslites.
   • Sisenema taustavärv: ##;joone värvi määramiseks. Asendage “##” värvi nime või räsiga (#), millele järgneb kuueteistkümnendarvuline värvikood.
   • Sisenema margin-right: ## px;pikslite arvu määramiseks paremast servast. Asendage "##" numbriliste pikslite arvuga või koodiga "auto". Sisestage "auto", et joondada joon vasakule või keskele.
   • Sisenema margin-left: ## px;pikslite arvu määramiseks vasakust servast. Asendage "##" numbriliste pikslite arvuga või koodiga "auto". Sisestage "auto", et joondada joon paremale või keskele.
   • Sisenema margin-top: ## px; joone ülemise polstri määramiseks. Asenda "##" numbriga, mis vastab polsterdusele pikslites.
   • Sisenema margin-bottom: ## px;joone alumise polstri määramiseks. Asenda "##" numbriga, mis vastab polsterdusele pikslites.
   • Sisenema äärise laius: ## px;joonistada kasti ümber joone (valikuline). Asenda "##" numbriga, mis vastab äärise laiusele pikslites.
   • Sisenema äärisevärv: ##;äärise värvi määramiseks (valikuline). Asendage “##” värvi nime või räsiga (#), millele järgneb kuueteistkümnendarvuline värvikood.
6. 6 Sisenema } pärast stiili atribuute, et lõpetada märgendi hr> stiil.
7. 7 Sisenema hr> horisontaaljoone lisamiseks HTML -dokumendi põhiosasse. CSS -i stiiliseaded rakendatakse iga kord, kui kasutate HTML -dokumendis märgendit hr>. Teie kood peaks välja nägema umbes selline:

   ! DOCTYPE html> html> head> style type = "text / css"> hr {laius: 50%; kõrgus: 20 pikslit; taustavärv: punane; margin-right: auto; margin-left: auto; ülemine äär: 5 pikslit; all-äär: 5 pikslit; äärise laius: 2 pikslit; äärise värv: roheline; } / style> / head> body> h1> Rubriik / h1> hr> p1> See rida tuleks pealkirjast eraldada horisontaalse joonega / p1> / body> / html>