Rounded corners
rounded-lg
Css
Black background
bg-dark
Css
Yellow border
border border-warning
Css
Shadow, white bg, rounded
shadow-lg p-3 mb-5 bg-white rounded
Css
Mixed (dark bg, yellow border and rounded corners)
rounded-lg border border-warning bg-dark
Css
Mixed2 (yellow border, rounded corners, shadow)
rounded-lg border border-warning shadow-lg p-3 mb-5 bg-white rounded
Css
Hot pink test
test
Css
.test {
background-color:hotpink;
}
.test .h1 {
font-weight:bold;
letter-spacing:.5em;
}
Shadow2
Css
.shadow2 {
box-shadow: 10px 10px 5px lightblue;
}
Rounded corners2
rcorners2
Css
.rcorners2 {
border-radius: 25px;
padding: 20px;
}
Rounded corners3
rcorners3
Css
.rcorners3 {
border-radius: 25px;
border: 2px solid #73AD21;
padding: 20px;
width: 500px;
height: 250px;
}
Background image
background
Css
.background {
background-image: url(/files/images/img_flwr.gif), url(/files/images/paper.gif);
background-position: right bottom, left top;
background-repeat: no-repeat, repeat;
border: 2px solid #73AD21;
width: 800px;
}
Background full width
background
Css
.background {
background-image: url(/files/images/img_flwr.gif), url(/files/images/paper.gif);
background-position: right bottom, left top;
background-repeat: no-repeat, repeat;
border: 2px solid #73AD21;
width: 100%;
}
Border image
borderimg
Css
.borderimg {
border: 10px solid transparent;
padding: 15px;
border-image: url(/files/images/border.png) 30 round;
}
video background
Css