Heim >Web-Frontend >CSS-Tutorial >So fügen Sie mithilfe von CSS (Code) ein Kontrollkästchen in der oberen rechten Ecke des Bildes hinzu
So fügen Sie mithilfe von CSS (Code) ein Kontrollkästchen in der oberen rechten Ecke des Bildes hinzu
- 不言Original
- 2018-08-28 11:24:592829Durchsuche
Der Inhalt dieses Artikels befasst sich mit dem Hinzufügen eines Kontrollkästchens (Code) in der oberen rechten Ecke des Bildes. Ich hoffe, dass es hilfreich ist Du.
Die Seite sieht wie folgt aus:
<%@ 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>Verwandte Empfehlungen:
So verwenden Sie CSS, um einem image_html/css_WEB-ITnose einen doppelten Rahmeneffekt hinzuzufügen
CSS-Implementierung zum Hinzufügen von Textbeschreibungen zu images_html/css_WEB-ITnose
Das obige ist der detaillierte Inhalt vonSo fügen Sie mithilfe von CSS (Code) ein Kontrollkästchen in der oberen rechten Ecke des Bildes hinzu. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!