Как да добавите хоризонтална линия в HTML

От тази статия ще научите как да добавите хоризонтална линия в HTML. Хоризонталната линия може да се използва за разделяне на съдържанието на сайта. Кодът за създаване на линия е доста прост. Въпреки това, HTML 4.01 Можете да промените дизайна на линията, като използвате вътрешни команди. HTML5 за оформяне на линията ще трябва да използва CSS.

Стъпка

Метод 1 от 2:

Работа в HTML 4.01

един. Отворете съществуващия или създайте нов HTML документ. HTML документите могат да се редактират в текстов редактор, като "Notepad", или в специализиран редактор на кода, като Adobe Dreamweaver. Следвайте тези стъпки, за да отворите HTML документ в избраната програма:

Отворете бележник или друг редактор на текст / код.
Отворете менюто Файл.
Кликнете Отворен.
Изберете HTML файл.
Кликнете Отворен

2. Изберете място, в което искате да вмъкнете линия. Превъртете надолу, докато намерите низ, върху който трябва да се появи линията, и след това преместете курсора директно в началото на тази линия, като кликнете върху неговия край.

3. Добавете празен низ. Два пъти кликнете два пъти ↵ Въведете, за да намалите текста, който трябва да поставите линията, след това поставете курсора на празния низ.

4. Добавяне на тагове
. Inter на празно място в началото на линията. Tag
Позволява ви да нарисувате хоризонтална линия през цялата страница.

пет. Преместете курсора след маркер "HR" на нов низ, като кликнете върху ↵ Въведете. Сега етикет
трябва да бъде в отделен ред.

6. Добавете атрибути към хоризонталната линия (по избор). Добавете атрибути като дължина, дебелина, цвят и подравняване. Ги приложете в къдрави скоби веднага след "HR". За да добавите няколко атрибута, разделете ги с интервал.

Inter , Да промените дебелината на линията. Заменете "#" цифрова дебелина (например размер ="10"Чест.

Inter , За да промените ширината на линията. Заменете "#" по броя на пикселите или процента от ширината на страницата (например ширина ="200" или ширина ="75%"Чест.

Inter , За да промените цветната линия. Заменете "#" с името на цвета или неговия шестнадесетичен код (например, цвят ="червен" или цвят ="# FF0000"Чест.

Inter , Да подравните линията. Заменете "#" към "дясно" (на десния ръб), "Left" (на левия ръб) или "Център" (центриран) (например) (например), Чест.

7. Запазете HTML файла. За да запишете текстовия файл като HTML документ, трябва да промените разширението на файла (.ТЕКСТ, .DOCX) ON.HTML ». Следвайте тези стъпки, за да запазите HTML документ:

Отворете менюто Файл.

Кликнете Запази като.

Въведете името на файла в полето "Име на файла".

Добави .HTML След името на файла.

Кликнете Save.

Осем. Проверете вашия HTML документ. За да проверите HTML файла, щракнете с десния бутон върху него и изберете "Open с". След това изберете уеб браузър. Когато сте поставили етикета "HR", трябва да се появи твърда линия. HTML код ще изглежда по този начин:

Размер на заглавието ="6" Ширина ="Петдесет%" подравняване ="Наляво" Цвят ="Зелено". TТози низ трябва да бъде отделен от заглавката на линията.

Метод 2 от 2:

Работа в CSS / HTML5

един. Отворете съществуващия или създайте нов HTML документ. HTML документите могат да бъдат редактирани в текстов редактор, като Notepad, или в специализиран редактор на код, като Adobe Dreamweaver. Следвайте тези стъпки, за да отворите HTML документ в избраната програма:

Отворете бележник или друг редактор на текст / код.
Отворете менюто Файл.
Кликнете Отворен.
Изберете HTML файл.
Кликнете Отворен

2. Добавете заглавие в HTML документ. Ако в HTML документа няма заглавие, изпълнете тези стъпки, за да го добавите. Заглавието трябва да върви след етикета И пред етикета .

Inter В горната част на документа.

Два пъти кликнете два пъти ↵ Въведете, за да добавите две нови линии.

Inter , За да затворите заглавието.

3. Inter вътрешен заглавие. "Стил" маркер се поставя между два заглавника, за да създаде място, където HTML дизайнът може да бъде променен с помощта на CSS код.

Алтернативни начини Можете да използвате таблица за външен стил. Прочети статията "Как да вмъкнете CSS файл в HTML", За да научите как да свържете външен CSS файл с HTML файл.

4. Inter HR {.Това е CSS маркер за оформяне на хоризонтална линия. Добавете го след етикета "стил" в заглавката или във външния CSS файл.

пет. Добавяне на стилове CSS за маркер
.Те трябва да отидат след етикета "HR {".Хоризонталната линия може да бъде издадена по много начини. По-долу са някои от тях.

Inter Ширина: ## px-, За да конфигурирате ширината на линията. Заменете ширината на стойността "##" в пикселите. Вместо пиксела (px), можете да използвате процент (%).

Inter Височина: ## px-, За да зададете дебелината на линията. Заменете "##" дебелината на линията в пикселите.

Inter Цвят на фона: ##-, За да укажете цвета на линията. Заменете "##" с името на цвета или решетката (#), след което ще отиде шестнадесетичният цветен код.

Inter Марж-дясно: ## px-, За да укажете броя на пикселите от десния край. Заменете "##" от няколко пиксела или кода "AUTO". Въведете "AUTO", за да подравните линията на левия край или в центъра.

Inter Margin-left: ## px-, За да укажете броя на пикселите от левия ръб. Заменете "##" от няколко пиксела или кода "AUTO".Въведете "AUTO", за да подравните линията на десния край или в центъра.

Inter Марж-топ: ## px- , За да укажете горното тире за линията. Заменете "##" по номера, съответстващ на ширината на тирето в пикселите.

Inter Марж-дъно: ## px-, За да посочите долната част на гърба. Заменете "##" по номера, съответстващ на ширината на тирето в пикселите.

Inter Ширина на границата: ## px-, Да нарисувате рамката около линията (по избор). Заменете "##" по номера, съответстващ на дебелината на рамката в пикселите.

Inter Цвят на границата: ##-, За да укажете цвета на рамката (по избор). Заменете "##" с името на цвета или решетката (#), след което ще отиде шестнадесетичният цветен код.

6. Inter } След атрибутите в стил, за да завършите настройката на стила за етикета
.

7. Inter навсякъде в тялото на HTML документа, за да добавите хоризонтална линия. Настройките на CSS стил ще бъдат нанесени след всяка употреба на маркера

в HTML документ.Вашият код трябва да изглежда приблизително, както следва:

 Тип ="Текст / CSS"> HR {Ширина: 50% -hiight: 20px-фонов цвят: червено-марж-дясно: авто-марж-ляв: авто-марж - отгоре: 5px-margin-дъно: 5px-граница на границата: 2px-граница Цвят: зеленЗаглавие
Този низ трябва да бъде отделен от заглавката на хоризонталната линия