Название | Самоучитель Вебмастера |
---|---|
Автор произведения | Системный Администратор |
Жанр | |
Серия | |
Издательство | |
Год выпуска | 2025 |
isbn |
* `<a>` – ссылки
Что такое CSS?
CSS (Cascading Style Sheets) – это язык стилей, используемый для определения внешнего вида и расположения элементов на веб-странице. CSS позволяет вам контролировать такие аспекты, как цвет, шрифт, размер, положение и многое другое.
Основные селекторы CSS
Вот некоторые основные селекторы CSS, которые вы должны знать:
* `*` – универсальный селектор
* `#id` – селектор по идентификатору
* `.class` – селектор по классу
* `tag` – селектор по тегу
Свойства CSS
Вот некоторые основные свойства CSS, которые вы должны знать:
* `color` – цвет текста
* `background-color` – цвет фона
* `font-size` – размер шрифта
* `font-family` – семейство шрифтов
* `width` – ширина элемента
* `height` – высота элемента
Пример простой веб-страницы
Вот пример простой веб-страницы, которая использует HTML и CSS:
```html
<!DOCTYPE html>
<html>
<head>
<title>Простая веб-страница</title>
<style>
body {
background-color: #f2f2f2;
}
h1 {
color: #00698f;
}
</style>
</head>
<body>
<h1>Привет, мир!</h1>
<p>Это простая веб-страница.</p>
</body>
</html>
```
В этом примере мы используем HTML для определения структуры страницы, а CSS для определения внешнего вида элементов на странице.
В следующей части мы продолжим изучать HTML и CSS, и научимся создавать более сложные веб-страницы.
2.2. Создание простых вебстраниц
Теперь, когда мы познакомились с основными понятиями вебразработки, давайте приступим к созданию простых вебстраниц. В этой главе мы будем использовать языки HTML и CSS, чтобы создать базовую структуру вебстраницы.
HTML – основа вебстраницы
HTML (HyperText Markup Language) – это язык разметки, используемый для создания структуры и содержания вебстраницы. HTML состоит из тегов, которые определяют различные элементы вебстраницы, такие как заголовки, абзацы, изображения и ссылки.
Базовая структура HTML-документа
Базовая структура HTML-документа выглядит следующим образом:
```html
<!DOCTYPE html>
<html>
<head>
<title>Название страницы</title>
</head>
<body>
<!– содержание страницы –>
</body>
</html>
```
Здесь:
* `<!DOCTYPE html>` – объявление типа документа
* `<html>` – корневой элемент HTML-документа
* `<head>` – раздел, содержащий метаданные о странице
* `<title>` – заголовок страницы
* `<body>` – раздел, содержащий содержание страницы
Создание простой вебстраницы
Давайте создадим простую вебстраницу,