Загрузить PDF
Загрузить PDF
В HTML цвет текста меняется с помощью тега <font> , но этот метод больше не поддерживается в HTML5. Вместо указанного тега нужно пользоваться CSS, чтобы задать цвет текста различных элементов страницы. Использование CSS гарантирует, что веб-страница будет совместима с любым браузером.
Шаги
-
1Откройте файл HTML. Лучший способ изменить цвет текста — это воспользоваться CSS. Старый тег <font> больше не поддерживается в HTML5. Поэтому воспользуйтесь CSS, чтобы определить стиль элементов страницы.
- Этот метод также применим к внешним таблицам стилей (отдельным файлам CSS). Приведенные ниже примеры предназначены для файла HTML с внутренней таблицей стилей.
-
2Размеcтите курсор внутри тега <head> . Стили определяются внутри этого тега, если используется внутренняя таблица стилей.
-
3Введите <style> , чтобы создать внутреннюю таблицу стилей. Когда тег <style> находится внутри тега <head>, таблица стилей, которая находится внутри тега <style>, будет применена к любым элементам страницы. Таким образом, начало HTML-файла должно выглядеть следующим образом: [1] X Источник информации
<!DOCTYPE html> < html > < head > < style > </ style > </ head >
-
4Введите элемент, цвет текста которого нужно изменить. Используйте раздел <style>, чтобы определить внешний вид элементов страницы. Например, чтобы изменить стиль всего текста на странице, введите следующее:
<!DOCTYPE html> < html > < head > < style > body { } </ style > </ head >
-
5В селекторе элемента введите атрибут color: . Этот атрибут определяет цвет текста выбранного элемента. В нашем примере этот атрибут изменит цвет основного текста, который является элементом, включающим весь текст на странице:
<!DOCTYPE html> < html > < head > < style > body { color : } </ style > </ head >
-
6Введите цвет текста. Это можно сделать тремя способами: ввести имя, ввести шестнадцатеричное значение или ввести значение RGB. Например, чтобы сделать текст синим, введите blue , rgb(0, 0, 255) или #0000FF .
<!DOCTYPE html> < html > < head > < style > body { color : red ; } </ style > </ head >
-
7Добавьте другие селекторы, чтобы изменить цвет различных элементов. Можно использовать различные селекторы, чтобы менять цвет текста разных элементов страницы:
<!DOCTYPE html> < html > < head > < style > body { color : red ; } h1 { color : #00FF00 ; } p { color : rgb ( 0 , 0 , 255 ) } </ style > </ head > < body > < h1 > Этот заголовок будет зеленым. </ h1 > < p > Этот параграф будет синим. </ p > Этот основной текст будет красным. </ body > </ html >
-
8Укажите стилевой класс CSS вместо того, чтобы менять элемент. Можно указать стилевой класс, а затем применить его к любому элементу страницы, чтобы изменить стиль элемента. Например, класс .redtext окрасит текст элемента, к которому применен этот класс, в красный цвет:
<!DOCTYPE html> < html > < head > < style > . redtext { color : red ; } </ style > </ head > < body > < h1 class = "redtext" > Этот заголовок будет красным </ h1 > < p > Этот параграф будет стандартным. </ p > < p class = "redtext" > Этот параграф будет красным </ p > </ body > </ html >
Реклама
-
1Откройте файл HTML. Можно воспользоваться атрибутами встроенного стиля, чтобы изменить стиль одного элемента страницы. Это может быть полезно, если нужно внести одно-два изменения в стиль, но не рекомендуется для широкомасштабного применения. Чтобы полностью изменить стиль, используйте предыдущий метод. [2] X Источник информации
-
2Найдите элемент, который нужно изменить. С помощью атрибутов встроенного стиля можно изменить цвет текста любого элемента страницы. Например, чтобы изменить цвет текста определенного заголовка, найдите его в файле:
<!DOCTYPE html> < html > < body > < h1 > Этот заголовок нужно изменить </ h1 > </ body > </ html >
-
3К элементу добавьте атрибут стиля. Внутри открывающего тега изменяемого элемента введите style="" :
<!DOCTYPE html> < html > < body > < h1 style = "" > Этот заголовок нужно изменить </ h1 > </ body > </ html >
-
4Внутри "" введите color: . Например:
<!DOCTYPE html> < html > < body > < h1 style = "color:" > Этот заголовок нужно изменить </ h1 > </ body > </ html >
-
5Введите цвет текста. Это можно сделать тремя способами: ввести имя, ввести шестнадцатеричное значение или ввести значение RGB. Например, чтобы сделать текст желтым, введите yellow; , rgb(255,255,0); или #FFFF00; :
<!DOCTYPE html> < html > < body > < h1 style = "color:#FFFF00;" > Этот заголовок стал желтым </ h1 > </ body > </ html >
Реклама
Советы
- Список поддерживаемых цветов и их шестнадцатеричные значения можно найти на сайте http://www.w3schools.com/colors/colors_names.asp
Реклама
Источники
Реклама
