小編給大家分享一下css怎樣把div修飾成圓,希望大家閱讀完這篇文章之后都有所收獲,下面讓我們一起去探討吧!
為龍華等地區(qū)用戶提供了全套網(wǎng)頁設計制作服務,及龍華網(wǎng)站建設行業(yè)解決方案。主營業(yè)務為網(wǎng)站建設、成都網(wǎng)站設計、龍華網(wǎng)站設計,以傳統(tǒng)方式定制建設網(wǎng)站,并提供域名空間備案等一條龍服務,秉承以專業(yè)、用心的態(tài)度為用戶提供真誠的服務。我們深信只要達到每一位用戶的要求,就會得到認可,從而選擇與我們長期合作。這樣,我們也可以走得更遠!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、保存好代碼,打開瀏覽器即可看見圓形。
實現(xiàn)原理:設置寬高相同,再設置圓角為寬高的一半,更方便的做法是直接設置圓角為50%。
看完了這篇文章,相信你對“css怎樣把div修飾成圓”有了一定的了解,如果想了解更多相關知識,歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!
本文名稱:css怎樣把div修飾成圓-創(chuàng)新互聯(lián)
轉載注明:http://aaarwkj.com/article10/pgedo.html
成都網(wǎng)站建設公司_創(chuàng)新互聯(lián),為您提供域名注冊、關鍵詞優(yōu)化、App開發(fā)、微信公眾號、自適應網(wǎng)站、網(wǎng)站維護
聲明:本網(wǎng)站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經(jīng)允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內容