как передняя часть帅小伙/靓姑娘, при разработке он всегда будет соответствоватьHTMLРабота с этикетками. Ознакомьтесь и начните использоватьdiv + cssМакет , сегодня я представлю статью, которая появилась давно, но не многие люди (не многие люди, которых я знаю, используют ее) используют ееHTML, познакомьтесь с ними.
1. предварительный тег
HTML <pre>Элементы представляют собой предопределенный форматированный текст. Текст в этом элементе обычно отображается моноширинным шрифтом в соответствии с макетом в исходном файле, и в тексте будут отображаться пробельные символы (например, пробелы и символы новой строки).
Например:
<pre>
< Hello World > 我 就是 想
--------------------------- 乱 七
\ ^__^ 八 遭
\ (oo)\_______
(__)\ )\/\ 的 定位 写
||----w |
|| || 出来 ~
</pre>
Изображение эффекта:
2. рисунок и рисунок
HTML <figure>Элемент представляет собой отдельный фрагмент контента, часто с заголовком.<figcaption>Используется вместе и как самостоятельная единица измерения. Когда он принадлежит к основному потоку контента, его положение не зависит от тела. Этот тег часто используется для изображений, иллюстраций, таблиц, фрагментов кода и т. д., на которые есть ссылки в основном тексте.
<figure>
<img style="width: 300px" src="https://github.com/quhongqiang/quhongqiang.github.io/blob/master/img/_posts/17.png?raw=true"
alt="Elephant at sunset">
<figcaption>这是的我微信公众号，快来扫码认识我吧~</figcaption>
</figure>
Изображение эффекта:
3. тег em и сильный тег
Элементы фокуса HTML (<em>), чтобы пометить контент, на чтении которого пользователь должен сосредоточиться,<em>Элементы могут быть вложенными. Чем глубже уровень вложенности, тем больше содержание, которое он содержит, считается более важным для чтения, обычно отображается как" курсивный шрифт ".
Сильный элемент (<strong>) указывает на то, что текст очень важен, обычно используетсяжирныйпоказывать.
4. Тег del и тег ins
HTML<del>Тег указывает на то, что что-то удалено из документаудалятьтекстовое содержание. Вы можете использовать этот тег, например, когда вам нужно отобразить изменения или различия исходного кода.
<p><del>这段文本已被删除。 </del>, 请浏览其它部分</p>
Изображение эффекта:
HTML <ins>Элемент определяет текст, который был вставлен в документ.
<ins>这一段文本是新插入至文档的。</ins>
Изображение эффекта:
5. Подтеги и вспомогательные теги
HTML <sub>Элемент определяет текстовую область, по соображениям макета по сравнению с основным текстом должен отображаться еще ниже и меньше.
<p>水的化学公式: H<sub>2</sub>O</p>
Изображение эффекта:
HTML <sup>Элемент определяет текстовую область, по типографским причинам, по сравнению с основным текстом,</sup>Содержимое будет отображаться на половине высоты символов в текущем текстовом потоке.
<p>2 + 3<sup>2</sup>= 11</p>
Изображение эффекта:
6. рубиновые теги
HTML <ruby>Элементы используются для отображения восточноазиатских фонетических или символьных аннотаций.
<ruby>
曲 <rp>(</rp><rt>qu</rt><rp>)</rp>
小 <rp>(</rp><rt>xiao</rt><rp>)</rp>
强 <rp>(</rp><rt>qiang</rt><rp>)</rp>
</ruby>
Изображение эффекта:
7. тег бдо
Определяет направление текста дочерних элементов, явно переопределяя направление текста по умолчанию.
<bdo>элемент (Двунаправленный HTML-элемент наложения) используется для переопределения ориентации текущего текста, в результате чего символы выстраиваются в линию в заданном направлении.
<p>这段文本是从左到右的</p>
<p><bdo dir="rtl">这段文本是从右到左的</bdo></p>
Изображение эффекта:
когда вы используетеcssКогда вы писали множество стилей, задумывались ли вы когда-нибудь о том, что существует тег, который может заменить множество атрибутов стиля?
Спасибо за просмотр~~~