您好,登錄后才能下訂單哦!
小編給大家分享一下css怎樣把div修飾成圓,希望大家閱讀完這篇文章之后都有所收獲,下面讓我們一起去探討吧!
css把div修飾成圓的方法:首先新建一個html文件;然后在body標簽內輸入“<div class="circle"></div>”;最后在head表里添加style標簽,并添加“border-radius”屬性即可。
css把div修飾成圓
1、打開代碼編輯器,新建一個html文件,寫上基本的結構
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> </html>
2、在body標簽內輸入:<div class="circle"></div>,這里的div就是用于畫圓形的標簽。
<body> <div class="circle"></div> </body>
3、在head表里添加style標簽,輸入下面代碼
<style> .circle{ width: 200px; height: 200px; border-radius: 100px; background-color: #1EFD0C; } </style>
5、保存好代碼,打開瀏覽器即可看見圓形。
實現原理:設置寬高相同,再設置圓角為寬高的一半,更方便的做法是直接設置圓角為50%。
看完了這篇文章,相信你對“css怎樣把div修飾成圓”有了一定的了解,如果想了解更多相關知識,歡迎關注億速云行業資訊頻道,感謝各位的閱讀!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。