Conţinut

• Pași
• Metoda 1 din 2: Lucrul în HTML 4.01
• Metoda 2 din 2: Lucrul în CSS / HTML5

Acest articol vă va arăta cum să adăugați o linie orizontală în HTML. Linia orizontală poate fi utilizată pentru a separa conținutul de pe site. Codul pentru crearea liniei este destul de simplu. Cu toate acestea, în HTML 4.01, este posibil să se schimbe designul unei linii folosind comenzi interne. În HTML5, va trebui să utilizați CSS pentru a stiliza linia.

Pași

Metoda 1 din 2: Lucrul în HTML 4.01

1. 1 Deschideți un document existent sau creați un nou document HTML. Documentele HTML pot fi editate cu un editor de text precum Notepad sau cu un editor de cod specializat precum Adobe Dreamweaver. Urmați acești pași pentru a deschide un document HTML în programul ales de dvs.:
   • Deschideți Notepad sau un alt editor de text / cod.
   • Deschideți meniul Fişier.
   • Click pe Deschis.
   • Selectați fișierul HTML.
   • Click pe Deschis
2. 2 Selectați locația în care doriți să inserați linia. Derulați în jos până găsiți linia de deasupra căreia ar trebui să apară linia, apoi mutați cursorul direct la începutul acelei linii făcând clic pe extrema stângă a acelei linii.
3. 3 Adăugați o linie goală. Apasare dubla ↵ Intrațipentru a muta în jos textul înaintea căruia doriți să inserați o linie, apoi plasați cursorul pe o linie goală.
4. 4 Adăugați hr> etichetă. introduce hr> la spațiul gol de la începutul liniei. Etichetă hr> vă permite să trasați o linie orizontală pe întreaga pagină.
5. 5 Deplasați cursorul după eticheta „hr” pe o nouă linie apăsând ↵ Intrați. Acum eticheta hr> ar trebui să fie pe o linie separată.
6. 6 Adăugați atribute liniei orizontale (opțional). Adăugați atribute precum lungimea, grosimea, culoarea și alinierea. Închideți-le în aparate dentare imediat după „hr”. Pentru a adăuga mai multe atribute, separați-le cu un spațiu.
   • introduce hr size = "#">pentru a modifica grosimea liniei. Înlocuiți „#” cu o valoare a grosimii numerice (de exemplu, dimensiunea = „10”).
   • introduce hr width = "#">pentru a modifica lățimea liniei. Înlocuiți „#” cu numărul de pixeli sau un procent din lățimea paginii (de exemplu, lățimea = „200” sau lățimea = „75%”).
   • introduce hr color = "#">pentru a schimba culoarea liniei. Înlocuiți „#” cu numele culorii sau codul hexazecimal (de exemplu, color = „roșu” sau color = „# FF0000”).
   • introduce hr align = "#">pentru a alinia linia. Înlocuiți „#” cu „dreapta” (dreapta), „stânga” (stânga) sau „centru” (centru) (de exemplu, hr width = "50%" align = "center">).
7. 7 Salvați fișierul HTML. Pentru a salva un fișier text ca document HTML, trebuie să schimbați extensia de fișier (.txt, .docx) în „.html”. Urmați acești pași pentru a salva documentul HTML:
   • Deschideți meniul Fişier.
   • Click pe Salvează ca.
   • Introduceți un nume pentru fișier în câmpul Nume fișier.
   • Adăuga .html după numele fișierului.
   • Click pe salva.
8. 8 Verificați documentul HTML. Pentru a verifica fișierul HTML, faceți clic dreapta pe acesta și alegeți Deschidere cu. Apoi selectați browserul web. Ar trebui să apară o linie continuă unde ați introdus eticheta „hr”. Codul HTML va arăta cam așa:

   ! DOCTYPE html> html> body> h1> Heading / h1> hr size = "6" width = "50%" align = "left" color = "green"> p1> Această linie trebuie separată de titlu printr-o linie . / P1> / body> / html>

Metoda 2 din 2: Lucrul în CSS / HTML5

1. 1 Deschideți un document existent sau creați un nou document HTML. Documentele HTML pot fi editate cu un editor de text precum Notepad sau cu un editor de cod specializat precum Adobe Dreamweaver. Urmați acești pași pentru a deschide un document HTML în programul ales de dvs.:
   • Deschideți Notepad sau un alt editor de text / cod.
   • Deschideți meniul Fişier.
   • Click pe Deschis.
   • Selectați fișierul HTML.
   • Click pe Deschis
2. 2 Adăugați un titlu în documentul dvs. HTML. Dacă documentul dvs. HTML nu are deja un titlu, urmați acești pași pentru a adăuga unul. Titlul trebuie să meargă după eticheta html> și înainte de eticheta body>.
   • introduce cap> în partea de sus a documentului.
   • Apasare dubla ↵ Intrațipentru a adăuga două linii noi.
   • introduce / cap>pentru a închide titlul.
3. 3 introduce style type = "text / css"> în interiorul antetului. Eticheta de stil este plasată între cele două etichete de titlu pentru a crea un loc în care puteți utiliza CSS pentru a modifica designul HTML.
   • Alternativ, puteți utiliza o foaie de stil externă. Citește articolul "Cum se introduce un fișier CSS în HTML»Pentru a afla cum să legați un fișier CSS extern la un fișier HTML.
4. 4 introduce HR {. Aceasta este eticheta CSS pentru stilizarea liniei orizontale. Adăugați-o după eticheta „stil” în antetul sau fișierul CSS extern.
5. 5 Adăugați stiluri CSS pentru eticheta hr>. Trebuie să vină după eticheta „hr {”. O linie orizontală poate fi stilizată într-o varietate de moduri. Mai jos sunt câteva dintre ele.
   • introduce lățime: ## px;pentru a regla lățimea liniei. Înlocuiți „##” cu lățimea liniei în pixeli. În loc de pixeli (px), puteți utiliza un procent (%).
   • introduce înălțime: ## px;pentru a regla greutatea liniei. Înlocuiți „##” cu lățimea liniei în pixeli.
   • introduce culoare de fundal: ##;pentru a specifica culoarea liniei. Înlocuiți „##” cu un nume de culoare sau hash (#) urmat de un cod de culoare hexazecimal.
   • introduce marginea-dreapta: ## px;pentru a specifica numărul de pixeli de la marginea din dreapta. Înlocuiți „##” cu un număr numeric de pixeli sau codul „auto”. Introduceți „auto” pentru a alinia linia la stânga sau la centru.
   • introduce margine-stânga: ## px;pentru a specifica numărul de pixeli de la marginea din stânga. Înlocuiți „##” cu un număr numeric de pixeli sau codul „auto”. Introduceți „auto” pentru a alinia linia la dreapta sau la centru.
   • introduce margin-top: ## px; pentru a specifica umplutura de sus pentru linie. Înlocuiți „##” cu un număr corespunzător umplerii în pixeli.
   • introduce marginea-jos: ## px;pentru a specifica umplutura de jos pentru linie. Înlocuiți „##” cu un număr corespunzător umplerii în pixeli.
   • introduce lățimea chenarului: ## px;pentru a desena o casetă în jurul liniei (opțional). Înlocuiți „##” cu un număr care corespunde lățimii chenarului în pixeli.
   • introduce border-color: ##;pentru a specifica culoarea chenarului (opțional). Înlocuiți „##” cu un nume de culoare sau hash (#) urmat de un cod de culoare hexazecimal.
6. 6 introduce } după atributele de stil pentru a finaliza stilul pentru eticheta hr>.
7. 7 introduce hr> oriunde în corpul documentului HTML pentru a adăuga o linie orizontală. Setările stilului CSS vor fi aplicate de fiecare dată când utilizați eticheta hr> în documentul dvs. HTML. Codul dvs. ar trebui să arate cam așa:

   ! DOCTYPE html> html> head> style type = "text / css"> hr {width: 50%; înălțime: 20px; culoare de fundal: roșu; marginea-dreapta: auto; margine-stânga: auto; marginea de sus: 5 px; marginea de jos: 5 px; lățimea chenarului: 2 px; culoarea chenarului: verde; } / style> / head> body> h1> Heading / h1> hr> p1> Această linie trebuie separată de titlu printr-o linie orizontală / p1> / body> / html>