#289122 color hex

Method 4 : use CSS

HTML :

CSS :

Each of these three methods should have the same output. For other symbols, the same three options exist. Some even have a fourth option, allowing you to use a string based reference (eg. to display ).

You can use a reference website like Unicode-table.com to find which icons are supported in UNICODE and which codes they correspond with. For example, you find the values for the down-pointing triangle at http://unicode-table.com/en/25BC/.

Note that these methods are sufficient only for icons that are available by default in every browser. For symbols like ,,★,,☭,⎗ or ⎘, this is far less likely to be the case. While it is possible to provide cross-browser support for other UNICODE symbols, the procedure is a bit more complicated.

If you want to know how to add support for less common UNICODE characters, see for more info on how to do this.

Поддерживаемые элементы формы

Примеры стандартных поддерживаемых элементов формы.

Поле ввода

Самый простой элемент формы с текстовыми полями ввода. Поддерживает все типы HTML5: текст, пароль, text, password, время и дата, региональные настройки времени и даты, дата, месяц, время, неделя, номер, электронная почта, URL, поиск, номер телефона и цвет.

Всякий раз обязательно используйте нужный тип .

  1. type=»text»placeholder=»Text input»>

Многострочный текст

Для элементов формы, которые позволяют использовать многострочный текст. Измените атрибут в случае необходимости.

  1. rows=»3″>

Флажки и радио-кнопки

Элементы «флажки» (чек-боксы) используются для выбора одной или нескольких опций в списке, а радио-кнопки предназначены только для выбора одной опции из нескольких.

По умолчанию (вертикально)

  1. class=»checkbox»>
  2. type=»checkbox»value=»»>
  3. А вот вам опция номер один — очень крутая штука.
  4. class=»radio»>
  5. type=»radio»name=»optionsRadios»id=»optionsRadios1″value=»option1″checked>
  6. А вот вам опция номер один — очень крутая штука.
  7. class=»radio»>
  8. type=»radio»name=»optionsRadios»id=»optionsRadios2″value=»option2″>
  9. Опция два — это нечто другое. Выбрав ее, отменяете первую.

Флажки в одной строке

Добавьте класс к нескольким флажкам или радио-кнопкам, чтобы разместить их на одной линии.

  1. class=»checkbox inline»>
  2. type=»checkbox»id=»inlineCheckbox1″value=»option1″> 1
  3. class=»checkbox inline»>
  4. type=»checkbox»id=»inlineCheckbox2″value=»option2″> 2
  5. class=»checkbox inline»>
  6. type=»checkbox»id=»inlineCheckbox3″value=»option3″> 3

Используйте опцию по умолчанию или укажите , чтобы отобразить сразу несколько опций.

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. multiple=»multiple»>
  7. 1
  8. 2
  9. 3
  10. 4
  11. 5

OPTION 1: UNICODE COLUMN SORT ARROWS

I found this one very handy for a single character column sorter. (Looks good upscaled).

= ⇕

IMPORTANT NOTE (When using Unicode symbols)

Unicode support varies dependant on the symbol of choice, browser and the font family. If you find your chosen symbol does not work in some browsers then try using a different font-family. Microsoft recommends however it would be wise to include the font with your website as not many people have it on their computers.

Open this page in other browsers to see which symbols render with the default font.

Some more Unicode arrows.

You can copy them right off the page below or you can use the code.

Each row of arrows is numbered from left to right:

Simply insert the corresponding number/letter before the closing semi-colon as above.

← ↑ → ↓ ↚ ↛ ↜ ↝ ↞ ↟

↠ ↡ ↢ ↣ ↤ ↥ ↦ ↧ ↨ ↫ ↬ ↭ ↮ ↯

↰ ↱ ↲ ↳ ↴ ↵ ↶ ↷ ↸ ↹ ↺ ↻ ↼ ↽ ↾ ↿

⇀ ⇁ ⇂ ⇃ ⇄ ⇅ ⇆ ⇇ ⇈ ⇉ ⇊ ⇋ ⇌ ⇍ ⇎ ⇏

⇐ ⇑ ⇒ ⇓ ⇔ ⇕ ⇖ ⇗ ⇘ ⇙ ⇚ ⇛ ⇜ ⇝ ⇞ ⇟

⇠ ⇡ ⇢ ⇣ ⇤ ⇥ ⇦ ⇧ ⇨ ⇩ ⇪ ⇫ ⇬ ⇭ ⇮ ⇯

⇰ ⇱ ⇲ ⇳ ⇴ ⇵ ⇶ ⇷ ⇸ ⇹ ⇺ ⇻ ⇼ ⇽ ⇾ ⇿

Навигация с переключением вкладок

В Bootstrap есть возможность переключения между контентом и вкладками. Это объединено в четырех стилях: top (по умолчанию), right, bottom и left.

Пример навигации с переключением вкладок

Чтобы сделать вкладки переключаемыми, создайте класс с уникальным ID для каждой вкладки и поместите их в класс .

Я в Разделе 1.

Привет, я в Разделе 2.

Эй, крошка, это Раздел 3.

  1. class=»tabbable»>
  2. class=»nav nav-tabs»>

  3. class=»active»>href=»#tab1″data-toggle=»tab»>Раздел 1
  4. href=»#tab2″data-toggle=»tab»>Раздел 2
  5. class=»tab-content»>

  6. class=»tab-pane active»id=»tab1″>

  7. Я в Разделе 1.
  8. class=»tab-pane»id=»tab2″>

  9. Привет, я в Разделе 2.

Требуется плагин jQuery

Все переключаемые вкладки созданы с помощью нашего простого плагина jQuery. Узнайте больше о том, как создавать переключаемые вкладки, на странице документации .

Переключение в любом направлении

Вкладки снизу

Разверните порядок HTML и добавьте класс, чтобы установить вкладки снизу.

Я в Разделе A.

Привет, я в Разделе B.

Эй, крошка, это Раздел C.

  1. class=»tabbable tabs-below»>
  2. class=»tab-content»>

  3. class=»nav nav-tabs»>

Вкладки слева

Замените класс, чтобы поставить вкладки слева.

Я в Разделе A.

Привет, я в Разделе B.

Эй, крошка, это раздел C.

  1. class=»tabbable tabs-left»>
  2. class=»nav nav-tabs»>

  3. class=»tab-content»>

Опции

Дополнительные цвета

Индикаторы процесса используют те же кнопки и классы сообщений для согласующихся стилей.

  1. class=»progress progress-info»>
  2. class=»bar»style=»width20%»>

  3. class=»progress progress-success»>
  4. class=»bar»style=»width40%»>

  5. class=»progress progress-warning»>
  6. class=»bar»style=»width60%»>

  7. class=»progress progress-danger»>
  8. class=»bar»style=»width80%»>

Полосатые индикаторы

Как и одноцветных, полосатых индикаторов процесса тоже имеется несколько.

  1. class=»progress progress-info progress-striped»>
  2. class=»bar»style=»width20%»>

  3. class=»progress progress-success progress-striped»>
  4. class=»bar»style=»width40%»>

  5. class=»progress progress-warning progress-striped»>
  6. class=»bar»style=»width60%»>

  7. class=»progress progress-danger progress-striped»>
  8. class=»bar»style=»width80%»>

Иконки glyphs

140 иконок в едином файле, по умолчанию в темно-сером и белом цвете. Предоставлены Glyphicons.

  • icon-glass
  • icon-music
  • icon-search
  • icon-envelope
  • icon-heart
  • icon-star
  • icon-star-empty
  • icon-user
  • icon-film
  • icon-th-large
  • icon-th
  • icon-th-list
  • icon-ok
  • icon-remove
  • icon-zoom-in
  • icon-zoom-out
  • icon-off
  • icon-signal
  • icon-cog
  • icon-trash
  • icon-home
  • icon-file
  • icon-time
  • icon-road
  • icon-download-alt
  • icon-download
  • icon-upload
  • icon-inbox
  • icon-play-circle
  • icon-repeat
  • icon-refresh
  • icon-list-alt
  • icon-lock
  • icon-flag
  • icon-headphones
  • icon-volume-off
  • icon-volume-down
  • icon-volume-up
  • icon-qrcode
  • icon-barcode
  • icon-tag
  • icon-tags
  • icon-book
  • icon-bookmark
  • icon-print
  • icon-camera
  • icon-font
  • icon-bold
  • icon-italic
  • icon-text-height
  • icon-text-width
  • icon-align-left
  • icon-align-center
  • icon-align-right
  • icon-align-justify
  • icon-list
  • icon-indent-left
  • icon-indent-right
  • icon-facetime-video
  • icon-picture
  • icon-pencil
  • icon-map-marker
  • icon-adjust
  • icon-tint
  • icon-edit
  • icon-share
  • icon-check
  • icon-move
  • icon-step-backward
  • icon-fast-backward
  • icon-backward
  • icon-play
  • icon-pause
  • icon-stop
  • icon-forward
  • icon-fast-forward
  • icon-step-forward
  • icon-eject
  • icon-chevron-left
  • icon-chevron-right
  • icon-plus-sign
  • icon-minus-sign
  • icon-remove-sign
  • icon-ok-sign
  • icon-question-sign
  • icon-info-sign
  • icon-screenshot
  • icon-remove-circle
  • icon-ok-circle
  • icon-ban-circle
  • icon-arrow-left
  • icon-arrow-right
  • icon-arrow-up
  • icon-arrow-down
  • icon-share-alt
  • icon-resize-full
  • icon-resize-small
  • icon-plus
  • icon-minus
  • icon-asterisk
  • icon-exclamation-sign
  • icon-gift
  • icon-leaf
  • icon-fire
  • icon-eye-open
  • icon-eye-close
  • icon-warning-sign
  • icon-plane
  • icon-calendar
  • icon-random
  • icon-comment
  • icon-magnet
  • icon-chevron-up
  • icon-chevron-down
  • icon-retweet
  • icon-shopping-cart
  • icon-folder-close
  • icon-folder-open
  • icon-resize-vertical
  • icon-resize-horizontal
  • icon-hdd
  • icon-bullhorn
  • icon-bell
  • icon-certificate
  • icon-thumbs-up
  • icon-thumbs-down
  • icon-hand-right
  • icon-hand-left
  • icon-hand-up
  • icon-hand-down
  • icon-circle-arrow-right
  • icon-circle-arrow-left
  • icon-circle-arrow-up
  • icon-circle-arrow-down
  • icon-globe
  • icon-wrench
  • icon-tasks
  • icon-filter
  • icon-briefcase
  • icon-fullscreen

Авторство Glyphicons

Набор иконок Glyphicons Halflings не является бесплатным, но по соглашению между Bootstrap и Glyphicons разработчики имеют возможность использовать его без дополнительной платы. В знак благодарности мы просим вас разместить ссылку на оригинал проекта Glyphicons.

Поддерживаемые устройства

Bootstrap поддерживает несколько медиа-запросов в одном файле, что позволяет работать Вашему проекту на различных устройствах и с разными разрешениями экранов. Сюда относятся следующие устройства:

Категория Ширина макета Ширина колонок Отступ между колонками
Большой дисплей 1200px и более 70px 30px
По умолчанию 980px и более 60px 20px
Портретные планшеты 768px и более 42px 20px
Планшеты 767px и менее Плавающие колонки, без фиксированной ширины
Смартфоны 480px и менее Плавающие колонки, без фиксированной ширины
  1. /* Large desktop */
  2. @media(min-width1200px){…}
  3. /* Portrait tablet to landscape and desktop */
  4. @media(min-width768px)and(max-width979px){…}
  5. /* Landscape phone to portrait tablet */
  6. @media(max-width767px){…}
  7. /* Landscape phones and down */
  8. @media(max-width480px){…}

Дополнительные адаптивные классы

Показанная здесь таблица классов обеспечивает динамику для различных устройств и их работу в связке с сеткой макета и медиа-запросами (разделено по устройствам). Данные классы вы можете найти в .

Класс Телефоны 767px и менее Планшеты 979px to 768px Ноутбуки и десктопы По умолчанию
Виден Скрыт Скрыт
Скрыт Виден Скрыт
Скрыт Скрыт Виден
Скрыт Виден Виден
Виден Скрыт Виден
Виден Виден Скрыт

Когда использовать?

Используйте ограниченный функционал и избегайте создания совершенно различных версий на одном сайте. Вместо этого используйте данные возможности для создания разных презентаций на разных устройствах.

Тестирование адаптивных классов

Измените размер окна в вашем браузере или запустите сайт на других устройствах для тестирования адаптивные классов.

Зеленые отметки обозначают, что класс виден на данном дисплее.

  • Телефон? Телефон
  • Планшет? Планшет
  • Десктоп? Десктоп

Скрыт на…

В этом случае зеленые отметки обозначают, что класс не отображается на данном дисплее.

  • Телефон? Телефон
  • Планшет? Планшет
  • Десктоп? Десктоп

Списки

Неупорядоченный

Список, в котором порядок явно не обозначен.

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
    • Ac tristique libero volutpat at
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc
  • Eget porttitor lorem

Упорядоченный

Список, в котором порядок четко определен.

  1. Lorem ipsum dolor sit amet
  2. Consectetur adipiscing elit
  3. Integer molestie lorem at massa
  4. Facilisis in pretium nisl aliquet
  5. Nulla volutpat aliquam velit
  6. Faucibus porta lacus fringilla vel
  7. Aenean sit amet erat nunc
  8. Eget porttitor lorem

Не стилизованный

Список без или без дополнительного левого поля.

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
    • Ac tristique libero volutpat at
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc
  • Eget porttitor lorem
  1. class=»unstyled»>

Описание

Список терминов с их сопутствующими описаниями.

Списки описаний
Список описания идеально подходит для определения терминов.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.

Горизонтальный список описания

Выстраивает термины и описания в одну линию.

Списки описания
Список описания идеально подходит для обозначения терминов.
Euismod
Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.
Donec id elit non mi porta gravida at eget metus.
Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Felis euismod semper eget lacinia
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
  1. class=»dl-horizontal»>

Types of SPAN:

Local SPAN: Mirrors traffic from one or more interface on the switch to one or more interfaces on the same switch.

Remote SPAN (RSPAN): An extension of SPAN called remote SPAN or RSPAN. RSPAN allows you to monitor traffic from source ports distributed over multiple switches, which means that you can centralize your network capture devices. RSPAN works by mirroring the traffic from the source ports of an RSPAN session onto a VLAN that is dedicated for the RSPAN session. This VLAN is then trunked to other switches, allowing the RSPAN session traffic to be transported across multiple switches. On the switch that contains the destination port for the session, traffic from the RSPAN session VLAN is simply mirrored out the destination port.

Encapsulated remote SPAN (ERSPAN): encapsulated Remote SPAN (ERSPAN), as the name says, brings generic routing encapsulation (GRE) for all captured traffic and allows it to be extended across Layer 3 domains.

ERSPAN is a Cisco proprietary feature and is available only to Catalyst 6500, 7600, Nexus, and ASR 1000 platforms to date. The ASR 1000 supports ERSPAN source (monitoring) only on Fast Ethernet, Gigabit Ethernet, and port-channel interfaces.

Дополнительные разновидности отображения

Зафиксируйте панель навигации вверху или внизу экрана с помощью дополнительногшо класса ближнего div .

Фиксирование вверху

Добавьте класс и помните о скрытых участках под ним. Обязательно добавьте как минимум отступ в 40px в . Добавление должно выполняться после ядра Bootstrap CSS и до дополнительной зависимой CSS.

  1. class=»navbar navbar-fixed-top»>

Добавьте класс.

  1. class=»navbar navbar-fixed-bottom»>

Статическая верхняя панель навигации

Создайте навигационную панель на всю ширину экрана. Она будет исчезать с поля зрения, если вы добавите класс . Это не похоже на класс , вам не нужно менять отступы в теле текста.

  1. class=»navbar navbar-static-top»>

Размещение всплывающих подсказок

В этом примере подсказка помещается справа ( ) «парящего» текста (

)

Также обратите внимание, что используется для размещения его в середине его элемента контейнера.
Мы используем число 5 , поскольку текст подсказки имеет верхний и нижний отступы 5px. Если увеличить его заполнение, также увеличьте значение свойства , чтобы убедиться, что он остается в середине (если это то, что вы хотите)

То же самое относится, если вы хотите, чтобы подсказка помещается влево.

.tooltip .tooltiptext {    top: -5px;   
left:
105%; }

Result:

Hover over me
Tooltip text

Левая подсказка

.tooltip .tooltiptext {    top: -5px;   
right:
105%; }

Result:

Hover over me
Tooltip text

Если вы хотите, чтобы всплывающая подсказка отображалась сверху или снизу, смотрите примеры ниже

Обратите внимание, что мы используем свойство со значением минус 60 пикселей. Это необходимо для центрирования всплывающей подсказки над/под текстом, наводимым курсором

Он равен половине ширины подсказки (120/2 = 60).

Верхняя подсказка

.tooltip .tooltiptext {    width: 120px;   
bottom: 100%;    left:
50%;     margin-left: -60px; /* Use half of the width
(120/2 = 60), to center the tooltip */}

Result:

Hover over me
Tooltip text

Нижняя подсказка

.tooltip .tooltiptext {    width: 120px;    top: 100%;    left:
50%;     margin-left: -60px; /* Use half of the width
(120/2 = 60), to center the tooltip */}

Result:

Hover over me

Стрелки подсказки

Чтобы создать стрелку, которая должна появиться с определенной стороны подсказки, добавьте «пустое» содержимое после подсказки, с классом псевдо-элемента вместе со свойством . Сама стрелка создается с использованием границ. Это сделает всплывающую подсказку похожим на пузырь речи.

В этом примере показано, как добавить стрелку в нижнюю часть подсказки:

Нижняя стрелка

.tooltip .tooltiptext::after {    content: » «;    position: absolute;    top: 100%;
/* At the bottom of the tooltip */    left: 50%;    margin-left: -5px;   
border-width: 5px;    border-style: solid;   
border-color: black transparent transparent transparent;}

Result:

Hover over me

Пример объяснено

Поместите стрелку в подсказку: будет размещать стрелку в нижней части всплывающей подсказки. будет центрировать стрелку.

Примечание: Свойство определяет размер стрелки. При изменении этого параметра также измените значение . Это будет держать стрелку в центре.

используется для преобразования содержимого в стрелку. Мы установили верхнюю границу черным, а остальные-прозрачными. Если бы все стороны были черные, вы бы в конечном итоге с черной квадратной коробке.

В этом примере демонстрируется добавление стрелки в верхнюю часть всплывающей подсказки.
Обратите внимание, что на этот раз мы установили нижний цвет границы:

Верхняя стрелка

.tooltip .tooltiptext::after {    content: » «;    position: absolute;   
bottom: 100%;  /* At the top of the tooltip */    left: 50%;    margin-left: -5px;   
border-width: 5px;    border-style: solid;   
border-color: transparent transparent black transparent;}

Result:

Hover over me
Tooltip text

В этом примере показано, как добавить стрелку слева от подсказки:

Стрелка влево

.tooltip .tooltiptext::after {    content: » «;    position: absolute;   
top: 50%;    right: 100%; /* To the left of the tooltip
*/    margin-top: -5px;   
border-width: 5px;    border-style: solid;   
border-color: transparent black transparent transparent;}

Result:

Hover over me
Tooltip text

В этом примере показано, как добавить стрелку справа от подсказки:

Стрелка вправо

.tooltip .tooltiptext::after {    content: » «;    position: absolute;
    top: 50%;    left: 100%; /* To the right of the
tooltip */    margin-top: -5px;   
border-width: 5px;    border-style: solid;   
border-color: transparent transparent transparent black;}

Result:

Hover over me
Tooltip text

Исчезать в подсказках (анимация)

Если вы хотите, чтобы исчезать в тексте подсказки, когда он должен быть видимым, вы можете использовать CSS свойство вместе с свойство, и перейти от полностью невидимым до 100% видимых, в число указанных секунд (1 секунды в нашем примере) :

Пример

.tooltip .tooltiptext {    opacity: 0;   
transition: opacity 1s;}.tooltip:hover
.tooltiptext {    opacity: 1;}

❮ Назад
Дальше ❯

Сообщение по умолчанию

Поместите любой текст и дополнительную кнопку в класс для обычного предупреждения.

?Предупреждение! Посмотрите на себя — вы не очень-то хорошо выглядите.

  1. class=»alert»>
  2. type=»button»class=»close»data-dismiss=»alert»>?
  3. Предупреждение! Посмотрите на себя — вы не очень-то хорошо выглядите.

Кнопки отмены

Мобильные браузеры Safari и Opera дополнительно к атрибуту требуют для отмены сообщений при использовании тега .

  1. href=»#»class=»close»data-dismiss=»alert»>?

Кроме того, вы можете использовать элемент с атрибутом данных, который мы выбрали для наших документов. Используя , вы должны включить в свою форму или ваша форма не будет подтверждена.

  1. type=»button»class=»close»data-dismiss=»alert»>?

Lists

Unstyled

Remove the default and left margin on list items (immediate children only). This only applies to immediate children list items, meaning you will need to add the class for any nested lists as well.

  • Lorem ipsum dolor sit amet
  • Consectetur adipiscing elit
  • Integer molestie lorem at massa
  • Facilisis in pretium nisl aliquet
  • Nulla volutpat aliquam velit
    • Phasellus iaculis neque
    • Purus sodales ultricies
    • Vestibulum laoreet porttitor sem
    • Ac tristique libero volutpat at
  • Faucibus porta lacus fringilla vel
  • Aenean sit amet erat nunc
  • Eget porttitor lorem

Inline

Remove a list’s bullets and apply some light with a combination of two classes, and .

  • Lorem ipsum
  • Phasellus iaculis
  • Nulla volutpat

Description list alignment

Align terms and descriptions horizontally by using our grid system’s predefined classes (or semantic mixins). For longer terms, you can optionally add a class to truncate the text with an ellipsis.

Description lists
A description list is perfect for defining terms.
Euismod

Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.

Donec id elit non mi porta gravida at eget metus.

Malesuada porta
Etiam porta sem malesuada magna mollis euismod.
Truncated term is truncated
Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.
Nesting
Nested definition list
Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.

Контекстуальные цвета (цвета для выделения текста)

В Twitter Bootstrap 3 имеются вспомогательные акцентные классы, с помощью которых вы можете установить цвет некоторому фрагменту тексту. Кроме текста эти классы также можно применять к ссылкам, которые не только изменяют цвет данной ссылки, но и делают её темнее при поднесении к ней курсора.

Например:

Текст:

Lorem ipsum dolor sit amet. Officiis debitis aut reiciendis voluptatibus maiores alias consequatur aut fugit.

Sint et dolorum fuga sit voluptatem accusantium. Cum soluta nobis est et dolorum fuga obcaecati cupiditate.

Delectus, ut aut perferendis doloribus asperiores repellat.. Excepturi sint, obcaecati cupiditate non provident, similique sunt.

Optio, cumque nihil impedit, quo minus. Similique sunt in culpa. Nam libero tempore, cum soluta.

Magni dolores et voluptates repudiandae. Voluptatem sequi nesciunt, neque porro quisquam est, omnis dolor repellendus quibusdam.

Repudiandae sint et aut fugit. Odit aut fugit, sed quia dolor sit, aspernatur aut rerum. Consectetur, adipisci velit, sed ut enim ipsam voluptatem, quia consequuntur magni.

Ссылки:

Примечание: Иногда акцентные классы могут не изменить цвет текста, который заключен в некоторый элемент в связи c влияния на данный элемент стилей других классов или селекторов. В большинстве случаев для решения подобной проблемы достаточно обернуть данный текст с помощью элемента и добавить к нему акцентный класс.

Теги HTML

c http-equiv=»Content-Type» content=»text/html;charset=UTF-8″>lass=»block_content scroll»>

  • Все теги
  • Валидация тегов
    • accesskey
    • charset
    • coords
    • download
    • href
    • hreflang
    • name
    • rel
    • rev
    • shape
    • tabindex
    • target
    • title
    • type
  • title

    • align
    • alt
    • archive
    • code
    • codebase
    • height
    • hspace
    • vspace
    • width
    • accesskey
    • alt
    • coords
    • href
    • hreflang
    • nohref
    • shape
    • tabindex
    • target
    • type
    • autoplay
    • controls
    • loop
    • muted
    • preload
    • src
    • href
    • target
    • color
    • face
    • size
  • dir

    • balance
    • loop
    • src
    • volume
    • alink
    • background
    • bgcolor
    • bgproperties
    • bottommargin
    • leftmargin
    • link
    • rightmargin
    • scroll
    • text
    • topmargin
    • vlink
  • clear

    • accesskey
    • autofocus
    • disabled
    • form
    • formaction
    • formenctype
    • formmethod
    • formnovalidate
    • formtarget
    • name
    • type
    • value
    • align
    • valign
    • align
    • char
    • charoff
    • span
    • valign
    • width
    • align
    • char
    • charoff
    • span
    • valign
    • width
    • cite
    • datetime
    • align
    • title
    • align
    • height
    • hidden
    • hspace
    • pluginspage
    • src
    • type
    • vspace
    • width
    • disabled
    • form
    • title
    • color
    • face
    • size
    • accept-charset
    • action
    • autocomplete
    • enctype
    • method
    • name
    • novalidate
    • target
    • bordercolor
    • frameborder
    • name
    • noresize
    • scrolling
    • src
    • border
    • bordercolor
    • cols
    • frameborder
    • framespacing
    • rows
  • align

  • align

  • align

  • align

  • align

  • align

  • profile

    • align
    • color
    • noshade
    • size
    • width
    • manifest
    • title
    • xmlns
    • align
    • allowtransparency
    • frameborder
    • height
    • hspace
    • marginheight
    • marginwidth
    • name
    • sandbox
    • scrolling
    • seamless
    • src
    • srcdoc
    • vspace
    • width
    • align
    • alt
    • border
    • height
    • hspace
    • ismap
    • longdesc
    • lowsrc
    • src
    • usemap
    • vspace
    • width
    • accept
    • accesskey
    • align
    • alt
    • autocomplete
    • autofocus
    • border
    • checked
    • disabled
    • form
    • formaction
    • formenctype
    • formmethod
    • formnovalidate
    • formtarget
    • list
    • max
    • maxlength
    • min
    • multiple
    • name
    • pattern
    • placeholder
    • readonly
    • required
    • size
    • src
    • step
    • tabindex
    • type
    • value
    • cite
    • datetime
    • accesskey
    • for
    • accesskey
    • align
    • title
    • type
    • value
    • charset
    • href
    • media
    • rel
    • sizes
    • type
  • name

    • behavior
    • bgcolor
    • direction
    • height
    • hspace
    • loop
    • scrollamount
    • scrolldelay
    • truespeed
    • vspace
    • width
    • label
    • type
    • charset
    • content
    • http-equiv
    • name
    • high
    • low
    • max
    • min
    • optimum
    • value
    • align
    • archive
    • classid
    • code
    • codebase
    • codetype
    • data
    • height
    • hspace
    • tabindex
    • type
    • vspace
    • width
    • reversed
    • start
    • type
    • disabled
    • label
    • disabled
    • label
    • selected
    • value
  • align

    • name
    • type
    • value
    • valuetype

Типы тегов

HTML5

Блочные элементы

Строчные элементы

Универсальные элементы

Нестандартные теги

Осуждаемые теги

Видео

Документ

Звук

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Форматирование

Формы

Фреймы

Ссылка на основную публикацию