Liste du didacticiel de base CSS et propriétés de bordure

Attribut de liste CSS

Les différents symboles devant les puces ou les chiffres ne peuvent pas être modifiés dans le style, donc en pratique nous n'utilisons généralement pas eux.

  • list-style : style de liste, valeur : aucun. Supprimez divers symboles avant les puces ou les chiffres.

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
    <style type="text/css">
        ul,li{list-style:none;}/*去掉前面的符号*/
    </style>
    </head>
    <body>
        <ul>
            <li>HTML+CSS</li>
            <li>JavaScript</li>
            <li>MySQL</li>
            <li>PHP</li>
        </ul>
    </body>
</html>

Attribut de bordure CSS : Chaque élément peut avoir une bordure

  • border-left : ligne de bordure gauche.

  • Format : bordure gauche : Épaisseur Style de ligne Couleur de ligne

  • Style de ligne : aucun (sans fil), plein (ligne continue), pointillé (ligne pointillée), pointillé (ligne pointillée)

  • Exemple : bordure gauche : 5px rouge pointillé

  • border-right : Ligne de bordure droite.

  • border-top : ligne de bordure supérieure.

  • border-bottom : ligne de bordure inférieure.

  • bordure : ajoutez des bordures sur quatre côtés en même temps.

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
    <style type="text/css">
        .box{
            background-color:#66ff66;
            width:200px;
            height:200px;
            border-left:6px solid red;
            border-right:3px dashed blue;
            border-top:5px dotted black;
        }
    </style>
    </head>
    <body>
        <div class="box"></div>
    </body>
</html>


Formation continue
||
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>php.cn</title> <style type="text/css"> ul,li{list-style:none;}/*去掉前面的符号*/ </style> </head> <body> <ul> <li>HTML+CSS</li> <li>JavaScript</li> <li>MySQL</li> <li>PHP</li> </ul> </body> </html>
soumettreRéinitialiser le code
  • Recommandations de cours
  • Téléchargement du didacticiel