Dezvoltatorii pot aplica mai multe proprietăți CSS pentru a-și face paginile web mai atractive, cum ar fi „ înălţime ' și ' lăţime ” proprietăți pentru setarea dimensiunii, ” aliniere text „ pentru ajustarea textului, „ stil de bordura ' și ' hotar-raza ” proprietăți pentru setarea chenarului în jurul elementului. În plus, puteți adăuga un chenar în funcție de cerințele dvs., cum ar fi pe o parte a elementului, doar pentru a face lucrurile din spatele obiectelor mai vizibile.
Această postare va demonstra:
Metoda 1: Setați chenar pe o parte
În CSS, utilizatorii pot seta chenarul pe o parte a elementului dorit. În acest scop, „ granița-stânga ”, “ granita-dreapta ”, “ border-top ' și ' chenar-de jos ”Proprietățile sunt folosite pentru adăugarea de chenaruri în partea stângă, dreapta, sus sau inferioară.
În această secțiune, vom seta în mod specific chenarul din partea stângă a containerului. Pentru a face acest lucru, urmați instrucțiunile de mai jos.
Pasul 1: Creați un container div
Mai întâi, creați un container div cu ajutorul „ Pasul 2: Inserați titlul Apoi, utilizați „< h1> ” etichetă pentru a adăuga un titlu în interiorul containerului div. Mai mult, puteți utiliza și alte etichete de antet conform cerințelor, cum ar fi „< h1> ” la „< h6> ' Etichete: Acum, accesați containerul HTML div și accesați numele clasei. Pentru a face acest lucru, un selector de clasă „ # ” este folosit cu numele clasei. Pasul 4: Introduceți chenar doar pe o parte După ce accesați containerul div, aplicați proprietățile CSS menționate mai jos: Imaginea rezultată arată chenarul cu o singură parte: Pentru a seta chenarul pe toate părțile cu culori diferite, utilizați codul HTML de mai sus. Apoi, accesați containerul div cu ajutorul numelui de id și al selectorului: Ca urmare, se va aplica chenarul cu stiluri diferite pe fiecare parte: Pentru a seta chenarul doar pe o parte, mai întâi, creați un div folosind „
< h1 > Graniță într-o parte h1 >
div >
Se poate observa că containerul a fost creat cu succes:
Pasul 3: Accesați containerul div
chenar-stânga: 5px solid roșu ;
fundal:rgb ( 56 , 239 , 245 ) ;
marjă: 20px 100px;
lățime: 200px; înălțime: 150px
}
Aici:
Metoda 2: Setați chenar pe toate părțile cu stiluri diferite
marja: 80px;
lățime chenar: 8px 2px 1px 10px;
chenar-rază: 50px;
stil de chenar: inserat solid dublu punctat;
culoare-chenar: rgb ( 40 , 5 , 235 ) rgb ( 238 , 146 , 9 ) rgb ( 255 , 0 , 242 ) rgb ( 19 , 19 , 18 ) ;
}
În codul furnizat mai sus:
În acest articol, ați învățat diferite moduri de a seta chenarul CSS pe una și mai multe părți. Concluzie