Cadre avec HTML - comment cela fonctionne
Pour rendre les médias de votre site Web plus attrayants, vous pouvez utiliser du code HTML pour dessiner un cadre autour de celui-ci. Dans cette astuce pratique, nous vous montrons comment cela fonctionne et quels avantages les feuilles de style en cascade (CSS) offrent lors de la définition d'un cadre.
Codage HTML - dessinez des cadres autour d'images et d'autres supports
Par défaut, chaque image a un cadre d'une largeur d'un pixel. Cependant, cela n'est visible que si l'image est utilisée comme hyperlien. L'attribut "bordure" vous permet de définir individuellement l'épaisseur du cadre.
- En HTML, le code d'un cadre noir de dix pixels ressemble à ceci:
- Ce cadre est appliqué aux quatre côtés de l'objet.
- Alternativement, vous pouvez utiliser un programme d'édition d'image tel que Gimp pour dessiner le cadre autour de votre image.
- Cependant, veuillez noter que cela agrandira l'image et que le visiteur de votre site Web mettra plus de temps à télécharger l'image.
![](http://hackzl.com/img/internet/9377/rahmen-mit-html-gehts.webp)
Définissez le cadre dans le document HTML avec CSS
Vous pouvez définir le cadre - par exemple une zone autour d'un texte - avec des feuilles de style en cascade encore plus précisément.
- Une autre astuce pratique vous explique comment intégrer un fichier CSS dans votre site Web.
- Dans ce document CSS, vous pouvez définir la couleur et l'épaisseur du cadre différemment pour les quatre pages:
- border-bottom: # 999 - Définit la couleur du cadre inférieur. Ici, vous pouvez également utiliser "border-top", "border-right" ou "border-left".
- border-width: 0 0 mince mince - Spécifie l'épaisseur de la ligne. Cela se fait dans le sens horaire. Ici, cela signifie qu'aucune ligne ne peut être vue en haut et à droite, tandis qu'une ligne fine a été définie en bas et à gauche.
- style bordure: aucun aucun groove groove - Définit le cadre décoratif de votre image ou de votre boîte. Le style "groove" crée un effet 3D.
![](http://hackzl.com/img/internet/9377/rahmen-mit-html-gehts-2.webp)
Votre page d'accueil vit naturellement de sa présence sur le net. Dans le prochain article, vous lirez les meilleurs conseils pour améliorer votre classement Google.