Comment changer le style de DIV via CSS

CSS est un élément indispensable du développement front-end. Dans le processus de conception de sites Web, l'application de CSS nous donne plus de créativité et nous aide à mieux réaliser les fonctions et l'embellissement du site Web. DIV fait partie du HTML et un élément essentiel de la conception de sites Web. Comment changer le style de DIV via CSS ?

1. Ajouter une couleur d'arrière-plan

Pour changer la couleur d'arrière-plan d'un DIV, il vous suffit de définir la propriété background-color en CSS. Vous pouvez choisir une couleur ou utiliser des valeurs de couleur RVB ou des codes de couleur hexadécimaux pour définir la couleur. couleur. Par exemple :

div {
    background-color: #000;
}

2. Définissez la bordure

Vous pouvez utiliser CSS pour définir la bordure du DIV, et vous pouvez définir la couleur, le type, la largeur et d'autres propriétés de la bordure. Par exemple :

div {
    border: 1px solid #000;
}

Ce code ajoutera une bordure noire unie de 1 pixel de large autour du DIV.

3. Ajustez la taille du DIV

Pour ajuster la taille du DIV, vous pouvez utiliser les attributs width et height pour définir la largeur et la hauteur du DIV. Par exemple :

div {
    width: 300px;
    height: 200px;
}

Dans cet exemple, le DIV a une largeur de 300 pixels et une hauteur de 200 pixels.

4. Ajouter un effet d'ombre

En CSS3, vous pouvez utiliser l'attribut box-shadow pour ajouter un effet d'ombre. Par exemple :

div {
    box-shadow: 2px 2px 2px #000;
}

Ce code ajoutera une ombre noire de 2 pixels de large autour du DIV.

5. Changez la police et la couleur du texte

Pour modifier le style du texte dans le DIV, vous pouvez définir la famille de police, la taille de la police, la couleur et d'autres attributs. Par exemple :

div {
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: #fff;
}

Cela utilisera la police Arial, une taille de texte de 14 pixels et une couleur de texte blanche.

Résumé

Styles CSS Nous n'avons introduit que quelques styles couramment utilisés. Bien sûr, il existe de nombreux choix de styles qui doivent être utilisés de manière appropriée. En changeant le style du DIV, nous pouvons obtenir une meilleure mise en page et une meilleure esthétique du site Web.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!