Comment définir la bordure div dans bootstrap

style de bordure div :

bordure : 1px solide #FF0000
signifie 4 éléments ; Tous les côtés sont bordés d'une bordure droite de 1 pixel, rouge.
1px représente la largeur de la bordure, solide représente une ligne droite (des lignes pointillées peuvent être utilisées), #FF0000 est la valeur de couleur

Plusieurs styles de bordure DIV courants, pas de bordure, bordure en pointillés, en pointillés line Bordures de type, bordures linéaires, bordures à double ligne, bordures rainurées, bordures striées, bordures à effet en ligne, bordures à effet en relief, etc.

Si vous souhaitez définir quatre côtés différents, utilisez :
border-top:
border-right:
border-bottom:
border-left:

Code d'implémentation du style de bordure div :

1. Bordure convexe extérieure :

Effet :
Texte du journal
Code :

<div style="BORDER-RIGHT: 3px outset;
 BORDER-TOP: 3px outset; 
 BACKGROUND: #ffffff; 
 BORDER-LEFT: 3px outset; 
 WIDTH: 100%; 
 BORDER-BOTTOM: 3px outset; 
 HEIGHT: 100%" align=left>日志文字</DIV>

Description du code :
La partie bleue est la partie modifiable, expliquez une à une :
Les quatre 2 représentent la largeur de la bordure en relief. Si vous utilisez 1, ce ne sera pas évident. . Comparez 2 ou 3. Convient ;
Les quatre débuts indiquent que le type de bordure est "en relief". S'ils sont modifiés en médaillon ou en double, ils auront respectivement les effets de bordures enfoncées et de bordures à double ligne. les codes pour les autres effets seront donnés ci-dessous ;
WIDTH : 100 % ; et HEIGHT : 100 % signifie que la largeur de cette boîte représente 100 % de la largeur du journal. Lorsque la fenêtre s'agrandit et se contracte, la largeur de. la boîte s'agrandira et se contractera également. HEIGHT représente la hauteur. De plus, il existe une autre façon de l'exprimer en px , l'unité est en pixels, par exemple : WIDTH : 355px signifie que la largeur de la boîte est de 355 pixels. avoir des largeurs de journaux différentes. Vous pouvez vous référer aux valeurs données ici. En général, cela peut être exprimé en pourcentage. Oui, mais vous devez parfois utiliser des pixels pour déterminer la taille, alors jouez simplement à l'oreille. align=left signifie que le contenu de la boîte est aligné à gauche. Changez respectivement de gauche à centre ou de droite pour aligner au centre et à droite. Si vous souhaitez un alignement à gauche, vous pouvez supprimer align=left. la valeur par défaut est l'alignement à gauche ;
ffffff représente la couleur d'arrière-plan dans la boîte, ffffff représente le blanc (000000 représente le noir), et la valeur de couleur peut se référer à ce tableau. Sélectionnez, en plus, changez #ffffff en transprant pour avoir un arrière-plan transparent. . Personnellement, je pense que les arrière-plans transparents sont plus couramment utilisés ; afin de faciliter le copier-coller, le code de bordure pour un arrière-plan transparent est donné comme suit : (La partie rouge dans la case est le code)

<DIV style="BORDER-RIGHT: 3px inset;
BORDER-TOP: 3px inset; 
BACKGROUND: #ffffff; 
BORDER-LEFT: 3px inset; 
WIDTH: 100%; 
BORDER- BOTTOM: 3px inset; 
HEIGHT: 100%" align=left>日志文字</DIV>

<DIV style="BORDER- RIGHT: 3px inset; 
BORDER-TOP: 3px inset; 
BACKGROUND: transprant; 
BORDER-LEFT: 3px inset; 
WIDTH: 100%; 
BORDER-BOTTOM: 3px inset; 
HEIGHT: 100%" align=left>日志文字</DIV> 代码

<DIV style="BORDER-RIGHT: 3px double #000000;
 BORDER-TOP: 3px double #000000; 
 BACKGROUND: #ffffff; 
 BORDER-LEFT: 3px double #000000; 
 WIDTH: 100%; 
 BORDER-BOTTOM: 3px double #000000; 
 HEIGHT: 100%" align=left>日志文字</DIV>

<DIV style="BORDER-RIGHT: 3px double #000000; 
BORDER-TOP: 3px double #000000; 
BACKGROUND: transprant; 
BORDER-LEFT: 3px double #000000; 
WIDTH: 100%; 
BORDER-BOTTOM: 3px double #000000; 
HEIGHT: 100%" align=left>日志文字</DIV>

<DIV style="BORDER-RIGHT: 2px dashed #000000; 
BORDER-TOP: 2px dashed #000000; 
BACKGROUND: #ffffff; 
BORDER-LEFT: 2px dashed #000000; 
WIDTH: 100%; 
BORDER-BOTTOM: 2px dashed #000000;
 HEIGHT: 100%" align=left>日志文字</DIV>

<DIV style="BORDER-RIGHT: 2px dashed #000000; 
BORDER-TOP: 2px dashed #000000; 
BACKGROUND: transpant; 
BORDER-LEFT: 2px dashed #000000; 
WIDTH: 100%;
 BORDER-BOTTOM: 2px dashed #000000;
  HEIGHT: 100%" align=left>日志文字</DIV>

<DIV style="BORDER-RIGHT: 7px groove; 
BORDER-TOP: 7px groove; 
BACKGROUND: transprant; 
BORDER-LEFT: 7px groove; 
WIDTH: 100%; BORDER-BOTTOM: 7px groove; 
HEIGHT: 100%" align=left>日志文字</DIV>

<DIV style="BORDER-RIGHT: 7px ridge; 
BORDER-TOP: 7px ridge; BACKGROUND: #ffffff; 
BORDER-LEFT: 7px ridge;
 WIDTH: 100%; 
 BORDER-BOTTOM: 7px ridge; 
 HEIGHT: 100%" align=left>日志文字</DIV>