html — Подчеркивание текста при использовании CSS
спросил
Изменено 11 лет, 4 месяца назад
Просмотрено 57 тысяч раз
Я новичок в CSS, поэтому хочу убедиться, что реализую его правильно. Мне нужно включить пояснительный абзац на веб-страницу. Я бы хотел, чтобы он выглядел по-другому, поэтому я включил во внешний файл CSS следующее:
div.usage { стиль шрифта: курсив; поле слева... поле справа... ; }
, а затем включил в файл HTML. Это работает, как и ожидалось.
Насколько я понимаю, при использовании CSS контент и макет разделены. Как же тогда мне подчеркивать какой-то текст в моем объяснении? Насколько я понимаю, я должен избегать следующего: .
- html
- css
Вы правы насчет разделения содержимого и макета, но в этом случае я бы обернул это тегом. Однако тег устарел. Я бы использовал что-то вроде этого:
Это очень важно.
и
em { text-decoration:underline; }
означает выделенный текст. По умолчанию используется курсив, поэтому, в зависимости от вашего сброса CSS, вам может потребоваться также сбросить font-syle до нормального.
Кроме того, подчеркивание текста обычно является плохой идеей, так как большинство людей считают подчеркнутый текст ссылками. Вместо этого я бы выделил его жирным шрифтом или, может быть, даже придал бы ему цвет фона.
Как вы сказали, HTML предназначен для контента, а CSS — для стилей. Таким образом, вам не нужно использовать стили в вашем HTML. В самом деле, когда вы думаете в HTML, вы должны думать не только о содержании, но и о семантике.
Итак, класс, который вы используете для своего div.usage выбран очень удачно, потому что он ничего не говорит о его стиле, но говорит о его семантике. А как насчет текста, который вы хотите подчеркнуть? Я бы сказал, что семантически это текст, который вы хотите выделить, и в HTML есть хороший элемент для этого: . Затем в своем HTML вы можете переопределить стиль браузера по умолчанию для элементов (жирный шрифт) для подчеркивания, которое вы хотите.
Это очень важно.сильный { вес шрифта: нормальный; оформление текста: подчеркивание; }
Если вы хотите использовать этот стиль только для выделенного текста внутри элемента div.usage , укажите более конкретно:
.usage strong {
вес шрифта: нормальный;
оформление текста: подчеркивание;
}
Конечно, вы не хотите добавлять div в селектор (я имею в виду лучше, чем div. ). Таким образом, вы готовы, если вы собираетесь кодировать, например, список или праграф с семантикой использования
usage .
Свойство «text-decoration: underline» позволяет убрать выделение текста.
Вы должны использовать один из этих тегов: или и стилизовать их в css.
.usage strong { вес шрифта: полужирный; }
В своей разметке вы определяете контент, который хотите выделить ( ) или сильно подчеркнуть (). См. http://www.w3.org/TR/html4/struct/text.html.
Я бы не стал использовать подчеркивание для выделения, так как это может сбить пользователей с толку, думая, что это гиперссылка.
Небольшой дружеский совет: лучше не использовать подчеркивание в Интернете, так как очень часто путают с кликабельной ссылкой.
Я бы посоветовал использовать
это важно
Который по умолчанию будет выделен жирным шрифтом.
Или, возможно, вы могли бы использовать желтый фон для текста, как маркер выделения…
текст выделенный текст
И поместите это в свой CSS
диапазон.подсветка {
цвет фона: #FF9;
}
вы можете попробовать это:
Это очень важно.
css:
.underline { text-decoration: underline; }
7привет для подчеркивания вы можете взять небольшой пример здесь
HTML
Это просто текст для проверки underline с помощью CSS.
CSS
div p { стиль шрифта: курсив; }
div p span{украшение текста: подчеркивание;}
В настоящее время люди говорят, что разметку не следует использовать, но мало кто может подтвердить это фактическими аргументами (в отличие от цитирования предполагаемых авторитетов и использования отрицательно звучащих прилагательных).
— самый простой и надежный способ. Вы по-прежнему можете позже решить, хотите ли вы использовать, скажем, жирный шрифт вместо подчеркивания, и тогда вы можете сделать это просто в CSS: u { украшение текста: нет; вес шрифта: полужирный; }
Для выделения другие методы почти всегда лучше, чем подчеркивание. Но бывают ситуации, когда подчеркивание является частью общепринятой системы обозначений (например, в фонетике или математике), и тогда вам может понадобиться использовать (и вам не захочется полагаться на CSS).
Вы можете инкапсулировать текст, который хотите подчеркнуть, в span и укажите класс для этого диапазона
.underline {
украшение текста: подчеркивание;
}
Это очень важно.
2Зарегистрируйтесь или войдите в систему
Зарегистрируйтесь с помощью GoogleОпубликовать как гость
Электронная почтаТребуется, но не отображается
Опубликовать как гость
Электронная почтаТребуется, но не отображается
Нажимая «Опубликовать свой ответ», вы соглашаетесь с нашими условиями обслуживания и подтверждаете, что прочитали и поняли нашу политику конфиденциальности и кодекс поведения.
Свойство CSS: text-underline-position: `from-font` | Могу ли я использовать… Таблицы поддержки для HTML5, CSS3 и т. д.
Могу ли я использовать Поиск ?Свойство CSS: text-underline-position: `from-font`
Глобальное использование
73,84% + 0% «=» 73,84%
IE
- 6 — 10: не поддерживается
- 11: не поддерживается
Edge
- 12 — 86: не поддерживается
- 87 — 112: Поддерживается
- 113: Поддерживается
Firefox
- 2–73: не поддерживается
- 31% — Supported»> 74–112: поддерживается
- 113: поддерживается
- 114–115: поддерживается
Chrome
- 4–86: не поддерживается
- 87–112: поддерживается
- 113: поддерживается
- 114–116: поддерживается
Safari
- 3.1–16.4: не поддерживается
- 16.5: не поддерживается
- 16.6: не поддерживается 90 209 TP: поддерживается
Opera
- 10–72: не поддерживается
- 73–97: поддерживается
- 03% — Supported»> 98: поддерживается
Safari на iOS
- 3.2–16.4: не поддерживается
- 16.5: не поддерживается 902 01
- все: поддержка неизвестна
- 2.1–4.4.4: не поддерживается
- 113: поддерживается
- 12–12.1: не поддерживается
- 73: поддерживается
- 113 : Поддерживается
- 113: Поддерживается
