小伙伴們在日常瀏覽網站和網頁的時候，時不時會看到有些網頁會有圓效果的出現，例如：有的網站圖片在一個圓的里面等等。那么，有的小伙伴們會想這個圓是怎樣用代碼實現的呢，用html還是css呢。在這里小編告知大家既不是用html，也不是用css，而是用css3。今天，小編會為小伙伴們分享如何用css制作實心圓。實現這些效果所用的css3的代碼就是向元素添加圓角邊框的border-radius屬性。首先，分享這個屬性是使用方法：

1：語法為：border-radius:左上角 右上角 右下角 左下角；

2：border-radius的值可以使用%，px， em。(但%和em目前的兼容性還不好。)

知道了這個屬性的使用的方法后，接下來小編會依次為小伙伴們講解制作實心圓，實心上半圓，以及實心右半圓的方法。

首先，制作實心圓的方法:1:把高和寬是值都設置一樣(也就是正方形)。2：圓角的值都設置高和寬值的一半。

代碼如下：

html代碼

css代碼

效果圖：

實心圓

今天就分享到這里吧，下期見。

總結

以上是生活随笔為你收集整理的java 实心圆,如何用css3实现实心圆的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。