-2
votes

Comment faire trois rectangles groupés?

Je voudrais faire trois rectangles regroupés avec du contenu texte et des coins arrondis, mais je ne sais pas trop comment?

Tous les extraits de code seraient appréciés. P>

<style> * { font-family: "arial" }</style> 
<style>
body {
margin: 0px;
}
</style>
<h1 class="small" style="background-attachment: scroll; background-clip: border-box; background-color: rgb(229, 229, 229); background-image: none; background-origin: padding-box; background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-size: auto; box-sizing: border-box; color: rgb(0, 0, 0); font-family: inherit; font-size: 22px; font-style: normal; font-variant: normal; font-weight: 600; letter-spacing: normal; line-height: 1.1; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; orphans: 2; padding-bottom: 15px; padding-left: 10px; padding-right: 10px; padding-top: 15px; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;">-</h1><span style="display: inline !important; float: none; background-color: rgb(255, 255, 255); color: rgb(51, 51, 51); font-family: Arial; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;">
</span><div class="field" style="background-attachment: scroll; background-clip: border-box; background-color: rgb(229, 229, 229); background-image: none; background-origin: padding-box; background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-size: auto; border-bottom-color: rgb(255, 255, 255); border-bottom-style: solid; border-bottom-width: 1px; border-image-outset: 0; border-image-repeat: stretch; border-image-slice: 100%; border-image-source: none; border-image-width: 1; border-left-color: rgb(225, 225, 225); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(225, 225, 255); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(0, 0, 0); border-top-style: solid; border-top-width: 1px; box-sizing: border-box; color: rgb(0, 0, 0); font-family: Arial; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; margin-bottom: 0px; margin-left: auto; margin-right: auto; margin-top: 0px; orphans: 2; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;">(-) <br></div>

html border

0 commentaires

3 Réponses :

0
votes

Vous devez ajouter bordure-rayon code> en classe .field strong> comme indiqué ci-dessous xxx pré>

voici le violon: P>



<h1 class="small">-</h1><span class="abc">
</span>
<div class="field">(-) <br></div>

1 commentaires

Vous pouvez faire cela ajouter la classe parent à votre HTML et n'utilisez pas de style inline écrire ceci dans le fichier CSS

0
votes

<style> * { font-family: "arial" }</style> 
<style>
body {
margin: 0px;
}
.field {
  border: 2px solid red !important;
  border-radius:5px;
}
</style>
<h1 class="small" style="background-attachment: scroll; background-clip: border-box; background-color: rgb(229, 229, 229); background-image: none; background-origin: padding-box; background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-size: auto; box-sizing: border-box; color: rgb(0, 0, 0); font-family: inherit; font-size: 22px; font-style: normal; font-variant: normal; font-weight: 600; letter-spacing: normal; line-height: 1.1; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; orphans: 2; padding-bottom: 15px; padding-left: 10px; padding-right: 10px; padding-top: 15px; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;">-</h1><span style="display: inline !important; float: none; background-color: rgb(255, 255, 255); color: rgb(51, 51, 51); font-family: Arial; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;">
</span><div class="field" style="background-attachment: scroll; background-clip: border-box; background-color: rgb(229, 229, 229); background-image: none; background-origin: padding-box; background-position-x: 0%; background-position-y: 0%; background-repeat: repeat; background-size: auto; border-bottom-color: rgb(0, 0, 0); border-bottom-style: solid; border-bottom-width: 1px; border-image-outset: 0; border-image-repeat: stretch; border-image-slice: 100%; border-image-source: none; border-image-width: 1; border-left-color: rgb(0, 0, 0); border-left-style: solid; border-left-width: 1px; border-right-color: rgb(0, 0, 0); border-right-style: solid; border-right-width: 1px; border-top-color: rgb(0, 0, 0); border-top-style: solid; border-top-width: 1px; box-sizing: border-box; color: rgb(0, 0, 0); font-family: Arial; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; margin-bottom: 0px; margin-left: auto; margin-right: auto; margin-top: 0px; orphans: 2; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;">(-) <br></div>

0 commentaires

0
votes

Essayez ceci xxx

0 commentaires