• Страница 1 из 1
  • 1
Использование элемента DIV в стиле CSS
Kosten
Понедельник, 18 Февраля 2019, 22:04 | Сообщение 1
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Думаю многим интересна какая роль div заключается в создании сайта или страницы, управлении стилем контента и достижении различных эффектов макета. Стилистика CSS является основой HTML, где безусловно CSS используется для установки стиля отображения элементов HTML на странице.

Также CSS3 является расширением стиля, который можно использовать для управления положением элементов HTML на веб-странице или в окне. Следующие две ссылки предоставляют подробные технические руководства для CSS и CSS3.



Используйте теги DIV

Используя CSS, который основном опираясь на тег div, когда вы помещаете содержимое HTML в тег div, также называемым блоком.

Вашему вниманию метод использования тегов DIV ничем не отличается от других тегов:

Код
<div>
  HTML контент
   </div>

Использование тега DIV без содержания CSS дает тот же эффект, что и использование P и /P.

Но когда CSS помещается в тег DIV, мы можем указать конкретное местоположение элемента HMTL на экране, нарисовать квадрат или линию в определенной позиции или указать, как текст отображается в блоке. Первое, что нужно сделать, это добавить уникальный идентификатор ID в элемент DIV, где роль идентификатора аналогична присвоению имени слою.

Код
  <div id="abc">

Добавить идентификационный номер

   </div>

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

Вы можете реализовать CSS двумя способами:

Встроенный CSS:

Встроенный является наиболее распространенным методом:

Код
<div id="abc" style="this is style">
Встроенный CSS
   </div>

Внешняя таблица стилей:

Результат использования внешнего метода импорта такой же, за исключением того, что его написать немного сложнее.

Код
<style type="text/css">

ID и CLASS - это команды, используемые для присвоения «имени» определенному формату CSS. Они используются, когда вы хотите применить определенный стиль форматирования в указанных областях. При выборе названий для этих областей не используйте символ подчеркивания. Старые браузеры Netscape и Opera могут иметь проблемы с их чтением.

HEAD

Код
<style type="text/css">
<!-- #abc {color: #41416b;} -->
</style>

BODY

Код
<p id="abc">Первый</p>
<p>Второй</p>

# Используется для указания идентификатора элемента. Там написано, это когда идентификатор найден в теге, используйте этот формат.

Идентификатор может использоваться только одним элементом. Это ограничивает использование этого типа форматирования, но иногда это все, что вам нужно. Для более универсального форматирования используется CLASS.

Элементы класса

Элементы CLASS очень похожи на элементы ID. Элементы ID используются для одного экземпляра или области. Элементы CLASS используются для многих случаев или большей площади.

Использование элемента ID или CLASS требует, чтобы код был указан в области HEAD (встроено) или на внешней странице CSS. Код с помощью находится в теге HTML в области BODY.

HEAD

Код
<style type="text/css">
<!-- .abc {color: #ff0000;} -->
</style>


BODY
Код
<p class="abc"> First </p>
<p> Second </p>
<h3 class="abc"> Third </h3>


Различия между ID и CLASS?

1. . Используется вместо #
2. Класс используется вместо идентификатора
3. Идентификатор для отдельных экземпляров или тегов.
4. Класс используется для нескольких экземпляров или тегов.
Прикрепления: 5595769.png (60.3 Kb)
Страна: (RU)
  • Страница 1 из 1
  • 1
Поиск: