html css 实现对话框右上角的删除按钮
程序员文章站
2022-05-16 19:54:04
...
点击某一个按钮,弹出对话框,需要在右上角添加删除按钮,其实很简单,需要创建一个对话框div,然后用css样式,固定位置top和right,如下:
(1)右上角的删除按钮css样式为:
.delete_right {
display: block;
cursor: pointer;
width: 12px;
height: 12px;
position: absolute;
top: 22px;
right: 30px;
background: url(../img/icons.png) -48px -96px no-repeat;
}
(2)html代码为:
<div ng-show="base_view" class="labletitle"
style="top: 54px; left: 0px;width: 70%; margin-top: 2%;margin-left: 22%;margin-right: 10%; background-color: #F7F4F4; -webkit-box-shadow: 0 8px 20px rgba(100, 100, 100, 0.85); z-index: 10;">
<a class="delete_right"></a></div>
推荐阅读
-
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
-
jQuery实现单击按钮遮罩弹出对话框(仿天猫的删除对话框)
-
HTML5+JS+CSS简单的实现左滑出现删除菜单,类似微信删除聊天框,代码完整
-
纯css3实现的幽灵按钮导航_html/css_WEB-ITnose
-
纯css3实现的鼠标悬停动画按钮_html/css_WEB-ITnose
-
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
-
纯css3实现的鼠标悬停动画按钮_html/css_WEB-ITnose
-
纯css3实现的幽灵按钮导航_html/css_WEB-ITnose
-
html+css3实现div右上角斜三角删除
-
html css 实现对话框右上角的删除按钮