这篇文章给大家分享的是css实现图片右上角添加复选框的方法,相信大部分人都还没学会这个技能,为了让大家学会,给大家总结了以下内容,话不多说,一起往下看吧。
坚守“ 做人真诚 · 做事靠谱 · 口碑至上 · 高效敬业 ”的价值观,专业网站建设服务10余年为成都自上料搅拌车小微创业公司专业提供成都企业网站定制营销网站建设商城网站建设手机网站建设小程序网站建设网站改版,从内容策划、视觉设计、底层架构、网页布局、功能开发迭代于一体的高端网站建设服务。
页面如下:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>测试</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <style type="text/css"> .main{ float:left; margin-left:8px; } </style> </head> <body> <div class="ztree"> <ul id="treeDemo" class="ztree"></ul> </div> <div class="main" style="position:relative;"> <div class="img"> <img alt="图片名称" src="plug-in/image/Desert.jpg" style="width:100px;height:100px"> </div> <div class="checkbox" style="position:absolute;top:0;right:0;z-index:1000"> <input id="box" type="checkbox" name="box"> </div> </div> <div class="main" style="position:relative;"> <div class="img"> <img alt="图片名称" src="plug-in/image/Desert.jpg" style="width:100px;height:100px"> </div> <div class="checkbox" style="position:absolute;top:0;right:0;z-index:1000"> <input id="box" type="checkbox" name="box"> </div> </div> <div class="main" style="position:relative;"> <div class="img"> <img alt="图片名称" src="plug-in/image/Desert.jpg" style="width:100px;height:100px"> </div> <div class="checkbox" style="position:absolute;top:0;right:0;z-index:1000"> <input id="box" type="checkbox" name="box"> </div> </div> </body> </html>
关于css实现图片右上角添加复选框的方法就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。
标题名称:css实现图片右上角添加复选框的方法
地址分享:https://www.cdcxhl.com/article28/jijccp.html
成都网站建设公司_创新互联,为您提供外贸建站、品牌网站制作、网站收录、服务器托管、电子商务、网站营销
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联