Heim  >  Artikel  >  Web-Frontend  >  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:592727Durchsuche

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!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn