html/css
Начал изучать html/css по вашим курсам. У лектора всё выглядит круто, но у меня часть функций почему то не отрабатывает. Например:
1. Не меняется фон блока
2. не увеличивается картинка при наведении мышкой
код css и html
body {
background-color: dodgerblue;
color: white;
}
h1 {
/* */
font-size: 24px;
color: yellow;
font-family: 'Times New Roman', Times, serif;
}
p.red {
color: red;
}
.block1 {
width: 80%; /* отображаемая ширина*/
margin: auto; /* внешние отступы*/
background-image: url("./img/pattern.png");
/* внутренние отступы */
padding: 2%;
/* Рамка */
/* border: 10px ridge black; */
border: 4mm ridge rgba(211, 220, 50, .6);
/* закругление рамки */
border-radius: 30px;
}
/* события при наведении курсора */
img {
/* увеличение */
transform: scale(1);
/* скорость события */
transition: 2s all;
}
img :hover {
transform: scale(1,2);
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- <meta http-equiv="X-UA-Compatible" content="IE=edge"> -->
<!-- <meta name="viewport" content="width=device-width, initial-scale=1.0"> -->
<title>Document</title>
<!-- подключение css внутри html -->
<!-- <style type="text/css">
body {
background-color: dodgerblue;
}
</style> -->
<!-- подключение css внешним файлом -->
<link rel="stylesheet" href="./css/style.css">
</head>
<body>
<div class="block1">
<h1 align="center"> Заголовок по центру</h1>
<h2 align="right">Второй заголовок справа</h2>
<!-- текст с форматированием -->
<!-- можно использовать многостраничный текст -->
<pre>fsdfsd</pre>
<!-- однострочный текст, убирает лишние пробелы -->
<p class="red"> этот текст должен быть красным</p>
<!-- тег для картинок -->
<img src="./img/pattern.png" alt="текст, если вдруг потеряли картинку, то появится эта надпись ">
</div>
</body>
</html>
