ホームページ > 記事 > ウェブフロントエンド > CSSを使って画像右上にチェックボックスを追加する方法（コード）
CSSを使って画像右上にチェックボックスを追加する方法（コード）
- 不言オリジナル
- 2018-08-28 11:24:592783ブラウズ
この記事の内容は、CSSを使用して画像の右上隅にチェックボックス（コード）を追加する方法についてです。必要な友人が参考になれば幸いです。
ページは次のとおりです:
<%@ 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 を使用して画像に二重境界線効果を追加する方法_html/css_WEB-ITnose
css_html/css_WEB を使用して画像にテキストの説明を追加する-いのせ
以上がCSSを使って画像右上にチェックボックスを追加する方法（コード）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。