- button
- half-transparent-border
- multiple-borders
- callout
- extended-bg-position
- inner-rounding
- stripes
- gridding
- polka
- checkerboard
- marching-ants
- footnote
- ellipse
- half-ellipse
- parallelograms-pseudo
- diamond-images
- bevel-corners-gradients
- scoop-corners
- trapezoid-tabs
- pie-static
- shadow
- color-tint-filter
- frosted-glass
- folded-corner
- hypenation
- line-breaks
- zebra-lines
- tab-size
- ampersands
- underlines
- text-effects
- circular-text
- cursor
- hit-area
- checkboxes
- weaken-background-by-shadow
- weaken-background-by-blur
- scrolling-hints
- image-slider
- intrinsic-sizing
- table-column-widths
- styling-sibling-count
- fluid-fixed
- vertical-centering
- sticky-footer
- bounce
- elastic
- frame-by-frame
- text-blink
- text-typing
- state-animations
- circular
文章来源于网络收集而来,版权归原创者所有,如有侵权请及时联系!
hit-area
<style>
button {
position: relative;
padding: .3em .5em;
background: #58a;
border-radius: 50%;
border: 1px solid rgba(0, 0, 0, .3);
box-shadow: 0 .1em .2em -.05em rgba(0, 0, 0, .5);
color: white;
font: bold 150%/1 sans-serif;
cursor: pointer;
}
button::before {
content: '';
position: absolute;
top: -10px;/* 10px larger than the host element */
right: -10px;
bottom: -10px;
left: -10px;
}
</style>
<button>+</button>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论