溫馨提示×

css怎么設置div圓角

清風
579
2021-03-11 09:30:25
欄目: 編程語言

css怎么設置div圓角

css設置div圓角的方法:

在css中可以通過設置border-radius讓div邊角變得圓潤。

示例:

<!DOCTYPE html>

<html>

<head>

<style> 

#rcorners1 {

  border-radius: 25px;

  background: #73AD21;

  padding: 20px; 

  width: 200px;

  height: 150px;  

}

#rcorners2 {

  border-radius: 25px;

  border: 2px solid #73AD21;

  padding: 20px; 

  width: 200px;

  height: 150px;  

}

#rcorners3 {

  border-radius: 25px;

  background: url(/i/paper.jpg);

  background-position: left top;

  background-repeat: repeat;

  padding: 20px; 

  width: 200px;

  height: 150px;  

}

</style>

</head>

<body>

<h1>border-radius 屬性</h1>

<p>擁有指定背景顏色的元素的圓角:</p>

<p id="rcorners1">Rounded corners!</p>

<p>帶邊框元素的圓角:</p>

<p id="rcorners2">Rounded corners!</p>

<p>擁有背景圖片的元素的圓角:</p>

<p id="rcorners3">Rounded corners!</p>

</body>

</html>


0
亚洲午夜精品一区二区_中文无码日韩欧免_久久香蕉精品视频_欧美主播一区二区三区美女