HTML and CSS code for creating a rounded rectangle using CSS3
Published on Aug. 22, 2023, 12:16 p.m.
Sure, I’ll provide an answer in English.
Here’s an example of a complete HTML and CSS code for creating a rounded rectangle using CSS3:
HTML code:
<div class="rounded-rectangle">
<p>This is a rounded rectangle</p>
</div>
CSS code:
.rounded-rectangle {
border-radius: 10px; /* Sets the border radius to 10 pixels */
width: 300px; /* Sets the width of the rectangle */
height: 100px; /* Sets the height of the rectangle */
background-color: #f2f2f2; /* Sets the background color of the rectangle */
padding: 20px; /* Sets the padding inside the rectangle */
}
In this example, we create a div with a class called “rounded-rectangle” and use CSS to round its corners. We set properties such as border radius, width, height, background color, padding, etc., to define the rounded rectangle we want.