Html двоеточие: Спецсимволы | htmlbook.ru

alexxlab

Спецсимволы | htmlbook.ru

Для отображения символов, которых нет на клавиатуре, применяются специальные знаки, начинающиеся с амперсанда (&) и заканчивающиеся точкой с запятой (;). В табл. 7.1 приведены некоторые популярные спецсимволы.

Табл. 7.1. Спецсимволы
ИмяКодВидОписание
   неразрывный пробел
£££фунт стерлингов
€€€знак евро
¶¶символ параграфа
§§§параграф
©©©знак copyright
®®®знак зарегистрированной торговой марки
™™™знак торговой марки
°°°градус
±±±плюс-минус
¼¼¼дробь — одна четверть
½½½дробь — одна вторая
¾¾¾дробь — три четверти
×××знак умножения
÷÷÷знак деления
ƒƒƒзнак функции
Греческие буквы
ΑΑΑгреческая заглавная буква альфа
ΒΒΒгреческая заглавная буква бета
ΓΓΓгреческая заглавная буква гамма
ΔΔΔгреческая заглавная буква дельта
ΕΕΕгреческая заглавная буква эпсилон
ΖΖΖгреческая заглавная буква дзета
ΗΗΗгреческая заглавная буква эта
ΘΘΘгреческая заглавная буква тета
ΙΙΙгреческая заглавная буква иота
ΚΚΚгреческая заглавная буква каппа
ΛΛΛгреческая заглавная буква лямбда
ΜΜΜгреческая заглавная буква мю
ΝΝΝгреческая заглавная буква ню
ΞΞΞгреческая заглавная буква кси
ΟΟΟгреческая заглавная буква омикрон
ΠΠΠгреческая заглавная буква пи
ΡΡΡгреческая заглавная буква ро
ΣΣΣгреческая заглавная буква сигма
ΤΤΤгреческая заглавная буква тау
ΥΥΥгреческая заглавная буква ипсилон
ΦΦΦгреческая заглавная буква фи
ΧΧΧгреческая заглавная буква хи
ΨΨΨгреческая заглавная буква пси
ΩΩΩгреческая заглавная буква омега
αααгреческая строчная буква альфа
βββгреческая строчная буква бета
γγγгреческая строчная буква гамма
δδδгреческая строчная буква дельта
εεεгреческая строчная буква эпсилон
ζζζгреческая строчная буква дзета
ηηηгреческая строчная буква эта
θθθгреческая строчная буква тета
ιιιгреческая строчная буква иота
κκκгреческая строчная буква каппа
λλλгреческая строчная буква лямбда
μμμгреческая строчная буква мю
νννгреческая строчная буква ню
ξξξгреческая строчная буква кси
οοοгреческая строчная буква омикрон
πππгреческая строчная буква пи
ρρρгреческая строчная буква ро
ςςςгреческая строчная буква сигма
σσσгреческая строчная буква сигма
τττгреческая строчная буква тау
υυυ
греческая строчная буква ипсилон
φφφгреческая строчная буква фи
χχχгреческая строчная буква хи
ψψψгреческая строчная буква пси
ωωωгреческая строчная буква омега
Стрелки
←←←стрелка влево
↑↑↑стрелка вверх
→→→стрелка вправо
↓↓↓стрелка вниз
↔↔↔стрелка влево-вправо
Прочие символы
♠♠♠ знак масти «пики»
♣		♣♣знак масти «трефы»
♥♥♥знак масти «червы»
♦♦♦знак масти «бубны»
""«двойная кавычка
&&&амперсанд
&lt;&#60;<знак «меньше»
&gt;&#62;>знак «больше»
Знаки пунктуации
&hellip;&#8230;…многоточие . ..
&prime;&#8242;′одиночный штрих — минуты и футы
&Prime;&#8243;″двойной штрих — секунды и дюймы
Общая пунктуация
&ndash;
&#8211;		–тире
&mdash;&#8212;—длинное тире
&lsquo;&#8216;‘левая одиночная кавычка
&rsquo;&#8217;’правая одиночная кавычка
&sbquo;&#8218;‚нижняя одиночная кавычка
&ldquo;&#8220;“левая двойная кавычка
&rdquo;&#8221;”правая двойная кавычка
&bdquo;&#8222;„нижняя двойная кавычка
&laquo;&#171;«левая двойная угловая скобка
&raquo;&#187;»правая двойная угловая скобка

спецсимволы

Псевдоклассы, псевдоэлементы | MDN

  • Назад
  • Обзор: Building blocks
  • Далее

Следующий набор селекторов, который мы рассмотрим, относится к псевдоклассам и псевдоэлементам.

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

Необходимые условия:Базовая компьютерная грамотность, установка базового ПО, базовые знания о работе с файлами, основы HTML (изучите Введение в HTML) и понимание работы CSS (изучите Введение в CSS.)
Цель:Узнать о селекторах псевдокласса и псевдоэлемента.

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

Псевдоклассы — это ключевые слова, которые начинаются с двоеточия:

:pseudo-class-name

Простой пример псевдокласса

Давайте рассмотрим простой пример. Если бы мы хотели сделать шрифт первого абзаца статьи более крупным и жирным, мы могли бы добавить класс к этому абзацу, а затем добавить CSS к этому классу, как показано в первом примере ниже:

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

:first-child — он всегда будет нацелен на первый дочерний элемент в статье, и нам больше не нужно будет редактировать HTML (к тому же это не всегда возможно, например, в случае если он генерируется CMS.)

Все псевдоклассы ведут себя подобным образом. Они нацелены на какой-то фрагмент вашего документа, находящийся в определённом состоянии, и ведут себя так, как если бы вы добавили класс в свой HTML. Рассмотрим некоторые другие примеры в MDN:

  • :last-child
  • :only-child
  • :invalid

Примечание: : Правильно писать псевдоклассы и элементы без какого бы то ни было предшествующего им селектора элемента. В примере выше вы могли бы написать :first-child и правило было бы применено к любому элементу, оказавшемуся первым дочерним для <article>, не только к первому дочернему абзацу — :first-child равнозначно *:first-child. Однако обычно вы хотите большего контроля, поэтому вам нужен более специфичный селектор.

Псевдоклассы пользовательского действия

Некоторые псевдоклассы применяются только тогда, когда пользователь некоторым образом взаимодействует с документом. Эти псевдоклассы действий пользователя, иногда называемые динамическими псевдоклассами, действуют так, как если бы класс был добавлен к элементу в момент взаимодействия с ним пользователя. Примеры даны для:

  • :hover — упоминался выше; он применяется только в том случае, если пользователь наводит указатель мыши на элемент, обычно на ссылку.
  • :focus — применяется только в том случае, если пользователь фокусируется на элементе, используя управление с клавиатуры.

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

::pseudo-element-name

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

Например, если вы хотите выбрать первую строку абзаца, вы могли бы обернуть её в <span> и использовать селектор элемента; однако это может не сработать, если количество слов, которые вы обернули, будет больше или меньше ширины родительского элемента. Поскольку мы, как правило, не знаем, сколько слов поместится в строке — т.к. их количество меняется, если меняется ширина экрана или размер шрифта — то надёжного решения при помощи HTML нет.

Селектор псевдоэлемента ::first-line сделает это наверняка — если количество слов увеличивается или уменьшается, он всё равно будет выбирать только первую строку.

Он действует так, как если бы <span> волшебным образом был обёрнут вокруг этой первой отформатированной строки и обновлялся бы каждый раз при изменении длины строки.

Вы можете видеть, что селектор выбирает первую строку обоих абзацев.

Если вы хотите сделать шрифт первой строки первого абзаца жирным, вы можете связать вместе селекторы :first-child и ::first-line. Попробуйте отредактировать предыдущий живой пример, чтобы использовалась следующая CSS. Мы говорим, что хотим выбрать первую строку первого элемента <p>, который находится внутри элемента <article>.

article p:first-child::first-line {
  font-size: 120%;
  font-weight: bold;
}

Существует пара специальных псевдоэлементов, которые используются вместе со свойством content для вставки содержимого в документ с помощью CSS.

Вы можете использовать их для вставки строки текста, как в приведённом ниже живом примере. Попробуйте изменить текстовое значение свойства content и вы увидите, как изменится результат. Можете также изменить псевдоэлемент ::before на ::after и увидите, что текст вставлен в конце элемента, а не в начале.

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

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

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

В следующем примере мы добавили пустую строку, используя псевдоэлемент ::before. Мы установили display: block, чтобы стилизовать его по ширине и высоте. Затем мы используем CSS, чтобы стилизовать его так же, как и любой другой элемент. Вы можете поиграть с CSS и изменить его внешний вид и поведение.

Использование псевдоэлементов ::before и ::after вместе со свойством content в CSS называется «генерируемым контентом» в CSS, и вы часто будете видеть, как этот метод используется для различных задач. Отличным примером является сайт CSS Arrow Please, который помогает вам генерировать стрелку с помощью CSS. Посмотрите на CSS, когда вы создадите свою стрелку, и вы увидите использование псевдо-элементов ::before и ::after. Всякий раз, когда вы будете видеть эти селекторы, смотрите на свойство content, чтобы увидеть, что добавляется в документ..

Существует большое количество псевдоклассов и псевдоэлементов, и полезно иметь список, к которому можно обращаться. Ниже приведены таблицы, в которых они перечислены, со ссылками на их справочные страницы в MDN. Используйте эти таблицы как справочник, чтобы видеть массив доступных вам средств для нацеливания на элементы.

Псевдоклассы

СелекторОписание
:activeПодходит, когда пользователь активирует (например, щёлкает мышью) элемент.
:any-linkСоответствует как состоянию :link, так и состоянию:visited ссылки.
:blankСоответствует элементу <input>, для которого значение ввода является пустым.
:checkedСоответствует переключателю или флажку в выбранном состоянии.
:current (en-US)Соответствует элементу или предку элемента, который в данный момент отображается.
:defaultСоответствует одному или нескольким элементам пользовательского интерфейса, которые являются элементами по умолчанию (обрабатывают нажатие клавиши enter) в наборе сходных элементов.
:dirВыбирает элемент на основе его направленности (значение атрибута HTML dir или свойства CSS direction ).
:disabledСоответствует элементам пользовательского интерфейса, которые находятся в отключённом состоянии.
:emptyСоответствует элементу, у которого нет дочерних элементов, кроме необязательного пробела.
:enabledСоответствует элементам пользовательского интерфейса, которые находятся во включённом состоянии.
:firstВ постраничном носителе соответствует первой странице.
:first-childСоответствует элементу, который является первым среди других дочерних элементов одного предка.
:first-of-typeСоответствует элементу, который является первым определённого типа среди других дочерних элементов одного предка.
:focusСоответствует элементу, имеющему фокус.
:focus-visibleСоответствует элементу, имеющему фокус, при этом фокус должен быть виден пользователю.
:focus-withinСоответствует элементу с фокусом, а также элементу с потомком, который имеет фокус.
:future (en-US)Соответствует элементам после текущего элемента.
:hoverСоответствует элементу, на который наведён курсор мыши.
:indeterminateСоответствует элементам пользовательского интерфейса, значение которых находится в неопределённом состоянии, обычно checkboxes (en-US).
:in-rangeСоответствует элементу с диапазоном, когда его значение находится в пределах диапазона.
:invalidСоответствует элементу, например <input>, в недопустимом состоянии.
:langСоответствует элементу, основанному на языке (значение атрибута HTML lang).
:last-childСоответствует элементу, который является последним среди других дочерних элементов одного предка.
:last-of-typeСоответствует элементу, который является последним определённого типа среди других дочерних элементов одного предка.
:leftВ постраничном носителе соответствует левосторонним страницам.
:linkСоответствует непосещавшимся ссылкам.
:local-link (en-US)Соответствует ссылкам, указывающим на страницы, которые расположены на том же сайте, что и текущий документ.
:is()Соответствует любому селектору из полученного списка селекторов.
:notСоответствует объектам, не входящим в список селекторов, переданный в качестве значения этому селектору.
:nth-childСоответствует элементам из списка дочерних элементов одного предка, которые подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать элементам 1, 3, 5, 7 и т. д. Все нечётные числа.)
:nth-of-typeСоответствует элементам из списка дочерних элементов одного предка, имеющим определённый тип (например, элементы <p>) — дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать элементам 1, 3, 5, 7 и т. д. Все нечётные числа.)
:nth-last-childСоответствует элементам из списка дочерних элементов одного предка, считая в обратном порядке от конца. Дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать последнему элементу в последовательности, затем на два элемента до него, затем ещё на два элемента назад и т. д. Все нечётные, считая с конца.)
:nth-last-of-typeСоответствует элементам из списка дочерних элементов одного предка, имеющим определённый тип (например, элементы <p>), считая в обратном порядке от конца. Дочерние элементы подобраны по формуле вида an+b (например, 2n + 1 будет соответствовать последнему элементу этого типа в последовательности, затем на два элемента до него, затем ещё на два элемента назад и т. д. Все нечётные, считая с конца.)
:only-childСоответствует элементу, являющемуся единственным дочерним для своего предка.
:only-of-typeСоответствует элементу, который отличается по типу от всех других дочерних элементов общего предка.
:optionalСоответствует необязательным элементам формы.
:out-of-rangeСоответствует элементу с диапазоном, когда его значение находится вне диапазона.
:past (en-US)Соответствует элементам перед текущим элементом.
:placeholder-shownСоответствует элементу input, который показывает текст-заполнитель.
:playing (en-US)Соответствует элементу, представляющему аудио, видео или подобный ресурс с возможными состояниями “воспроизведён” или “приостановлен”, когда этот элемент “воспроизводится”.
:paused (en-US)Соответствует элементу, представляющему аудио, видео или подобный ресурс с возможными состояниями “воспроизведён” или “приостановлен”, когда этот элемент “приостановлен”.
:read-onlyСоответствует элементу, который не может быть изменён пользователем.
:read-writeСоответствует элементу, который может быть изменён пользователем.
:requiredСоответствует обязательным элементам формы.
:rightВ постраничном носителе соответствует правосторонним страницам.
:rootСоответствует элементу, который является корнем документа.
:scope (en-US)Соответствует любому элементу, который является элементом области видимости.
:validСоответствует элементу, такому как <input>, в допустимом состоянии.
:targetСоответствует элементу, если он является целью текущего URL (т. е. если у него есть ID, соответствующий текущему URL fragment).
:visitedСоответствует посещённым ссылкам.

Псевдоэлементы

СелекторОписание
::afterСоответствует элементу, который допускает стилизацию и появляется после текущего содержимого порождающего элемента.
::beforeСоответствует элементу, который допускает стилизацию и появляется перед текущим содержимым порождающего элемента.
::first-letterСоответствует первой букве элемента.
::first-lineСоответствует первой строке содержимого порождающего элемента.
::grammar-errorСоответствует части документа, содержащей грамматическую ошибку, отмеченную браузером.
::markerСоответствует полю маркера пункта списка, которое обычно содержит жирную точку или число.
::selectionСоответствует части документа, которая была выбрана.
::spelling-error (en-US)Соответствует части документа, содержащей орфографическую ошибку, отмеченную браузером.
  • Назад
  • Обзор: Building blocks
  • Далее
  1. Каскад и наследование
  2. Селекторы CSS
    • Селекторы типа, класса и ID
    • Селекторы атрибута
    • Псевдоклассы и псевдоэлементы
    • Комбинаторы
  3. Модель коробки
  4. Фон и границы
  5. Обработка разных направлений текста
  6. Переполнение содержимого
  7. Значения и единицы измерения
  8. Изменение размеров в CSS
  9. Элементы изображений, форм и медиа-элементы
  10. Стилизация таблиц
  11. Отладка CSS
  12. Организация вашей CSS

Found a content problem with this page?

  • Edit the page on GitHub.
  • Report the content issue.
  • View the source on GitHub.

Want to get more involved?

Learn how to contribute.

This page was last modified on by MDN contributors.

Имена объектов HTML5 по алфавиту — C

❮ Предыдущая Далее ❯

Старые версии браузеров могут не поддерживать все элементы HTML5, указанные в таблице ниже.
Chrome и Opera имеют хорошую поддержку, а IE 11+ и Firefox 35+ поддерживают все сущности.

Символ Имя объекта Шестнадцатеричный декабрь
Ć Cacute 00106 262
ć cacute 00107 263
⋒ CAP 022D2 8914
∩ CAP 02229 8745
& Capand; крышка и 02A44 10820
⩉ capbrcup 02A49 10825
⩋ заглушка 02A4B 10827
⩇ колпачок 02A47 10823
⩀ 02A40 10816
&CapitalDifferentialD; CapitalDifferentialD 02145 8517
∩︀ колпачки 02229 0FE00 8745
⁁ каретка 02041 8257
ˇ Карон 002C7 711
&Кейлис; Кейлис 0212D 8493
⩍ колпачки 02A4D 10829
Č Ccaron 0010C 268
č 0010D 269
Ç Ccedil 000C7 199
ç ccedil 000E7 231
Ĉ Ccirc 00108 264
ĉ ccirc 00109 265
∰ Cconint 02230 8752
⩌ ccups 02A4C 10828
⩐ ccupssm 02A50 10832
Ċ Cdot 0010A 266
ċ CDOT 0010B 267
¸ CEDIL 000B8 184
& Cedilla; Седилья 000B8 184
&пусто; CEMPTYV 029B2 10674
¢ Cent 000A2 162
& CENTRTDT; CenterDot 000B7 183
&centerdot; центральная точка 000B7 183
ℭ Cfr 0212D 8493
𝔠 cfr 1D520 120096
Ч CHcy 00427 1063
ч chcy 00447 1095
✓ чек 02713 10003
&checkmark; галочка 02713 10003
Χ CHI 003A7 935
χ CHI 003C7 967
& CIR; CIR 025CB 9675
ˆ Circ 002C6 710
& CIRCEQ; circeq 02257 8791
&circlearrowleft; кругстрелка влево 021BA 8634
&circlearrowright; 021BB 8635
&circledast; 0229B 8859
&circledcirc; обведено кружком 0229A 8858
&обведено тире; кружокдтире 0229D 8861
⊙ Круговая точка 02299 8857
&обведен R; обведеноR 000AE 174
Ⓢ обведен S 024C8 9416
⊖ CircleMinus 02296 8854
&CirclePlus; CirclePlus 02295 8853
&CircleTimes; Число кругов 02297 8855
⧃ cirE 029C3 10691
≗ cire 02257 8791
⨐ 02A10 10768
&circmid; цирмид 02AEF 10991
ˆ круговой 029C2 10690
∲ cwconint 02232 8754
&По часовой стрелкеКонтурИнтеграл; По часовой стрелкеКонтурИнтеграл 02232 8754
&CloseCurlyDoubleQuote; CloseCurlyDoubleQuote 0201D 8221
&CloseCurlyQuote; CloseCurlyQuote 02019 8217
♣ трефы 02663 9827
♣ клубный костюм 02663 9827
∷ двоеточие 02237 8759
&двоеточие; двоеточие 0003A 58
&Колонка; Colone 02A74 10868
≔ двоеточие 02254 8788
≔ колонэк 02254 8788
&запятая; запятая 0002C 44
@ коммат 00040 64
∁ 02201 8705
∘ компл. 02218 8728
&дополнение; дополнение 02201 8705
&complexes; Комплексы 02102 8450
≅ Конг 02245 8773
& CONGDOT; congdot 02A6D 10861
&Соответствует; Конгруэнтность 02261 8801
∯ Conint 0222F 8751
∮ conint 0222E 8750
&ContourIntegral; ContourIntegral 0222E 8750
ℂ копф 02102 8450
&копф; копф 1D554 120148
∐ копрод 02210 8720
&Сопродукт; Копродукт 02210 8720
© Копия 000A9 169
& copysr; COPYSR 02117 8471
↵ CRARR 021B5 8629
& CORSE; Крест 02A2F 10799
✗ крест 02717 10007
𝒞 Cscr 1D49E 119966
𝒸 cscr 1D4B8 119992
⫏ csub 02ACF 10959
⫏ куб 02AD1 10961
⫐ csup 02AD0 10960
⫒ csupe 02AD2 10962
⋯ ctdot 022EF 8943
⤸ cudarrl 02938 10552
⤵ кударрр 02935 10549
⋞ cuepr 022DE 8926
⋟ cuesc 022DF 8927
↶ cularr 021B6 8630
⤽ cularrp 0293D 10557
⋓ Чашка 022D3 8915
∪ чашка 0222A 8746
⩈ cupbrcap 02A48 10824
≍ CupCap 0224D 8781
⩆ крышка чашки 02A46 10822
⩊ чашка 02A4A 10826
⊍ 0228D 8845
⩅ чашка 02A45 10821
∪︀ чашки 0222A + 0FE00 8746
↷ 021B7 8631
⤼ curarrm 0293C 10556
&curlyeqprec; curlyeqprec 022DE 8926
&curlyeqsucc; curlyeqsucc 022DF 8927
⋎ Curlyvee 022CE 8910
&curlywedge; CurlyWeedge 022CF 8911
¤ CURRREN 000A4 164
& CURVARLFT; криваястрелка влево 021B6 8630
&криваястрелка вправо; 021B7 8631
⋎ кюве 022CE 8910
⋏ 022CF 8911
∲ cwconint 02232 8754
∱ cwint 02231 8753
⌭ цикл 0232D 9005

❮ Предыдущий Следующий ❯


ВЫБОР ЦВЕТА

Лучшие учебники
Учебник по HTML
Учебник по CSS
Учебник по JavaScript
Учебник How To
Учебник по SQL
Учебник по Python
Учебник по W3. CSS
Учебник по Bootstrap
Учебник по PHP
Учебник по Java
Учебник по C++
Учебник по jQuery

Основные ссылки
Справочник по HTML
Справочник по CSS
Справочник по JavaScript
Справочник по SQL
Справочник по Python
Справочник по W3.CSS
Справочник по Bootstrap
Справочник по PHP
Цвета HTML
Справочник по Java
Справочник по Angular
Справочник по jQuery

Top6s Примеры HTML
Примеры CSS
Примеры JavaScript
Примеры инструкций
Примеры SQL
Примеры Python
Примеры W3.CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery

FORUM | О

W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания. Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования, куки-файлы и политика конфиденциальности.

Copyright 1999-2023 Refsnes Data. Все права защищены.
W3Schools работает на основе W3.CSS.

Добавление пробела после двоеточия с помощью CSS и HTML

спросил

Изменено 1 год, 8 месяцев назад

Просмотрено 749 раз

Я пытаюсь отформатировать свою страницу с различными метками, двоеточиями и ответами. Например:

 Предлагаемые занятия: математика, английский язык, физика
Общее количество студентов: 30

Я использую элемент списка и сильные теги для части метки. Итак, код выглядит так:

 
  • Общее количество студентов:30
    •

    Однако этот код приводит к отсутствию пробела между двоеточием и ответом. Что я могу сделать, чтобы решить эту проблему?

    • HTML
    • CSS

    1

    Это просто, просто добавьте   после двоеточия, например:

     
  • Общее количество учеников:  30
    •

    Существуют различные методы, например, с использованием неразрывного пробела:

     < ул>

  • Общее количество учащихся:30
    •

    Но пробел на самом деле не является частью семантики вашего текста, поэтому поле справа может быть более логичным:

     сильный {
  поле справа: 0,5em;
} 
     <ул>
    
  • Общее количество студентов:30
    •

    Если вам в html нужен пробел, вы всегда можете вставить  

    В вашей ситуации вы можете добавить пробел, но только один. Дополнительные пробелы игнорируются.

     
  • Общее количество студентов: 30
    • 

  • Общее количество учащихся: 30
    • 

  • Общее количество студентов:    30
    •

    Конечно, вы можете отформатировать HTML-код, включив пробел, в том числе просто добавив пробел или   внутри вашего селектора strong .

    Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *