Стилизованные кавычки

Beginner

This tutorial is from open-source community. Access the source code

Введение

В этом практическом занятии мы изучим свойство quotes в CSS, которое позволяет нам настраивать кавычки, используемые для встроенных цитат. Мы узнаем, как использовать это свойство для определения собственных символов открывающей и закрывающей кавычек и применить их к элементам <q> в нашем HTML. В конце этого практического занятия вы будете лучше понимать, как добавить индивидуальный стиль в оформление своих веб-страниц.

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

Стилизованные кавычки

В ВМ уже предоставлены файлы index.html и style.css.

Для настройки встроенных кавычек измените свойство quotes внутри элемента <q>.

Например:

<p><q>Do or do not, there is no try.</q> – Yoda</p>

можно оформить в виде кавычек-кареток с использованием CSS:

q {
  quotes: "“" "”";
}

Пожалуйста, нажмите кнопку 'Go Live' в нижнем правом углу, чтобы запустить веб-сервис на порту 8080. Затем можно обновить вкладку Web 8080, чтобы просмотреть веб-страницу.

Резюме

Поздравляем! Вы завершили практическое занятие по стиллизованным кавычкам. Вы можете выполнить больше практических занятий в LabEx, чтобы улучшить свои навыки.