【CSS】凹槽的写法
2024-08-27 18:47:57
效果图:
实例代码:
<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#btn {
display: block;
width: 100px;
height: 40px;
background-color: lightcoral;
text-align: center;
line-height: 40px;
position: relative;
color: #FFF;
font-size: 2em;
margin: 0 auto;
} #btn::before {
content: "";
width: 30px;
height: 30px;
border-radius: 30px;
background: #fff;
position: absolute;
display: block;
left: -15px;
top: 5px;
}
</style>
</head> <body>
<div id="btn"></div>
</body> </html>
最新文章
- ife-task0003学习收获总结
- 传统高斯模糊与优化算法(附完整C++代码)
- [复变函数]第11堂课 3.3 Cauchy 积分定理及其推论
- poj 3621(最优比率环)
- Project Euler 109 :Darts 飞镖
- Object-C 内存管理及对象
- c# Internet时间服务器同步
- JS获取地址参数
- RS100项目进展更新
- 最简单的Java框架
- kubernetes 留言版DEMO
- ZOJ1654 Place the Robots
- web.xml组件加载顺序
- dedecms织梦判断当前页面是首页、栏目页还是文章页
- java 获取用户ip
- jenkin如何实现web版本控制&;回退
- 2018(2017)美图java服务端笔试(回忆录)
- Servlet(三):获取表单数据、解决乱码和报错问题
- Spring Aware接口
- Oracle 中 nvl、nvl2、nullif、coalesce、decode 函数的用法详解
热门文章
- 3dContactPointAnnotationTool开发日志(一)
- JS DOM视频相关的知识
- zookeeper伪集群安装
- 织梦CMS建站入门学习(二)
- title &; abbr &; tooltips
- BZOJ 1010 玩具装箱(斜率优化DP)
- 【bzoj4579】[Usaco2016 Open]Closing the Farm 并查集
- 前端基础:HTML标签(上)
- Python re(正则表达式)模块
- BZOJ4514:[SDOI2016]数字配对——题解