Автор:
Bobbie Johnson
Дата Створення:
7 Квітень 2021
Дата Оновлення:
26 Червень 2024
Зміст
- кроки
- Метод 1 з 2: Створення жирного тексту за допомогою HTML
- Метод 2 з 2: Створення жирного тексту за допомогою CSS
- Поради
Мова розмітки HTML дозволяє виділити текст жирним без особливих проблем, причому навіть відразу декількома способами. Втім, буде краще, якщо ви витратите пару хвилин, вивчаючи базові правила каскадних таблиць стилів - CSS, і додасте їх в документ, щоб вже потім працювати саме там. Суть в тому, що куди простіше управляти зовнішнім виглядом веб-сторінки з CSS, в тому числі і тоді, коли щось потрібно виділити жирним.
кроки
Метод 1 з 2: Створення жирного тексту за допомогою HTML
1 strong> Використовуйте тег strong / strong>. У HTML5, таким чином, щоб виділяти текст краще саме так. У більшості випадків цей тег виділить текст жирним. - Помістіть текст, який потрібно виділити, всередині тегів: strong>саме тут/ Strong>.
2 Використовуйте заголовки, якщо це доречно. Як правило, їх розміщують у верхніх частинах сторінки або на початку нового розділу. За замовчуванням, заголовки відображаються крупніше і жирніше звичайного тексту, хоча і тут не без тонкощів. Є шість рівнів заголовків, від 1 до 6: h1> - h6>. Follow these guidelines when using them: - Тема h1 пишеться так: h1> заголовок першого рівня / h1>, і це найважливіший, найбільший заголовок сторінки.
- h2> Тема h2 / h2> - для другого за значимістю заголовка, ну і так далі аж до самого h6> заголовка h6, найдрібнішого з усіх / h6>.
- Використовувати заголовки потрібно акуратно, в міру, єдино для упорядкування контенту сторінки. Користувач повинен мати можливість побачити заголовок якомога швидше, щоб зрозуміти, під ним чи потрібний йому контент.
- Створюючи підзаголовки, варто опускатися все на рівень за раз. Іншими словами, не треба ставити після h1> відразу h3>. Так форматування сторінки при конвертації в інший формат не зіб'є.
3 b> В крайньому випадку, використовуйте тег b / b>. Тег b> все ще підтримується в HTML5, але strong> куди як краще. Використовувати b> можна в тому випадку, коли текст виділяється в стилістичних, що не семантичних цілях - наприклад, для виділення ключових або словникових слів, назв товарів і так далі. - Як і більшість тегів, b> - парний, керуючий поміщеним усередину нього текстом / b>.
Метод 2 з 2: Створення жирного тексту за допомогою CSS
1 Запам'ятайте, коли варто використовувати CSS. CSS - дуже потужний і зручний інструмент редагування зовнішнього вигляду сторінки. Власне, CSS - це те, як сторінка «виглядає», тоді як HTML - то, що вона «значить». Звичайно, в тегах HTML немає нічого поганого, ними можна користуватися, але краще все ж працювати з CSS - ви отримаєте більше контролю над тим, як саме буде виглядати ваш текст. - Відкрийте просту HTML-сторінку в різних браузерах. Помітили, що вона відображається злегка по-різному в кожному? За допомогою CSS можна звести цю різницю до мінімуму.
2 Додайте до тексту тег span>. Якщо ви ще не володієте CSS, то почати варто з так званого "inline CSS" - «вбудованих таблиць стилів», якщо завгодно. Цим, звичайно, можна користуватися, щоб міняти вид тегів на кшталт p> або h1>, але часом так можна поміняти і такий текст, який ще не взято в які б то не було теги. Тег span> / span> - це як би обгортка, яка сама по собі ніякого ефекту або впливу не робить, але дає нам можливість привнести потрібні зміни на сторінку. Ось приклад: - span> Я вчуся виділяти текст жирним за допомогою inline CSS./span>
3 Додайте атрибут style. Атрибути в HTML пишуться прямо в тезі, прямо в галочки ». Атрибут style необхідний для вставки CSS-коду в HTML-тег, так що вставте style = в тег span: - span style => Я вчуся виділяти текст жирним за допомогою inline CSS ../ span>
- Навіщо додавати атрибут style, якщо не додавати сам стиль? Мислите вірно. Але ми тут викладаємо все покроково!
4 Додайте властивість font-weight. Властивості CSS додаються як частина атрибута, в нашому випадку - як частина атрибута style, а саме «font-weight» (жирність шрифту, якщо буквально). Ця властивість може бути використано для завдання накреслення шрифту, причому не тільки жирного, а й екстра-жирного, тонкого або нормального. Після знака = напишіть "Font-weight:". Має вийти приблизно так: - span style = "font-weight:"> Я вчуся виділяти текст жирним за допомогою inline CSS ../ span>
- Поки зробіть паузу, нічого більше не пишіть (і так, ще не все).
- Не забудьте поставити лапки до і після font-weight:.
5 Додайте значення bold. Що залишилось? Правильно, задати властивості атрибута значення! Куди його вставити? Правильно, між font-weight: і закриває лапками. У цієї властивості є кілька різновидів, що відрізняються жирністю накреслення, і найпростіше буде скористатися значенням bold: - span style = "font-weight: bold"> Я вчуся виділяти текст жирним за допомогою inline CSS./span>
6 Експериментуйте з іншими значеннями. CSS дає куди більше можливостей, ніж HTML, так що не думайте, ніби ви зв'язані по руках і ногах. Ось кілька альтернатив значенням "bold": - span style = "font-weight: bolder"> "Bolder" - так текст завжди буде жирніше батьківського елемента, як би жирним той не був сам по собі. / span> Якщо весь параграф виділено за допомогою "bold," то "bolder" допоможе виділити ще жирніше, скажімо, окрема пропозиція, що в середині його.
- span style = "font-weight: normal"> "Normal" - такий текст буде виглядати як зазвичай, навіть коли знаходиться всередині тега, що виділяє текст жирним. / span>
- span style = "font-weight: 900"> Для завдання жирності тексту можна використовувати значення від 100 до 900. 400 - звичайне написання, жирне - від 700 і вище. / span>
Поради
- Використовуючи в CSS для завдання жирності цифрові значення, використовуйте ті, що кратні 100. Всі інші значення все одно будуть округлятися в більшу сторону.
- Зовнішній CSS-файл, що і говорити, куди зручніше того, про що розповідається в цій статті - так можна буде з одного файлу управляти зовнішнім виглядом всіх сторінок сайту відразу!
- Не можна зробити шрифт жирніше, ніж закладено в нього спочатку друкарями. Працюючи з CSS, пам'ятайте - шрифт буде змінюватися відповідно до стандарту. Відповідно, різниці між двома жирними варіантами шрифтів ви не побачите (точніше, можете і побачити - але це вже залежить від шрифту).
