简体   繁体   中英

How do I make an outline of a circle in CSS

How can I create an outline of a circle using CSS, just having the stroke of a circle while the inside of the circle is empty?

I tried border but it doesnt display in chrome just firefox.
I tried:

box-shadow: 0 0 0 0.15em #000;

which looks great on chrome, but in firefox it looks uneven jagged .
Does anyone have any suggestions?
This is for circles used for check/filling in.

It looks like a FireFox issue...

A way around would be to show the shadow inside the circle, instead of outside.

box-shadow: inset 0 0 0 0.15em #000;

Try this:

.circle {
  border: 1px black solid;
  border-radius: 50px;
  height: 50px;
  width: 50px;
  background-color: white;
}

It should work on chrome, especially doing it this way.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM