Caso:
- Dibuja un cuadrado con una longitud de lado de 100 px y un color de fondo rosa.
- Establezca el ángulo en radianes a 15px
<!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>
<style>
/* 按类名选择 */
.box {
width: 100px;
height: 100px;
background-color: pink;
border-radius: 15px;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
Puntos de conocimiento:
- Utilice el selector de nombre de clase para ajustar el estilo de los elementos de la página correspondientes al nombre de la clase. Además de los selectores de nombres de clases, CSS también incluye
id选择器伪类选择器子选择器 - Cuatro estilos CSS con significado
widthheightbackground-colorborder-radiuschino correspondiente al inglés - La página se configura automáticamente con un estilo -
间距, lo que hace que el cuadro no pueda adherirse a la esquina superior izquierda; por lo tanto, el estilo de la página debe borrarse antes de cada desarrollo.
Tarea: dibujar la siguiente imagen
insinuación:
- El diseño es el siguiente
- Necesita establecer
页面高度100%, la página esbody
<div class="container">
<div class="head">头部</div>
<div class="left">侧边栏</div>
</div>