深度阅读

HTML and CSS code for creating a rounded rectangle using CSS3

作者
作者
2023年08月22日
更新时间
8.36 分钟
阅读时间
0
阅读量

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.

相关标签

博客作者

热爱技术,乐于分享,持续学习。专注于Web开发、系统架构设计和人工智能领域。