博客列表 >在线相册管理器-4月9日作业

在线相册管理器-4月9日作业

潮涌学习php的博客
潮涌学习php的博客原创
2018年05月29日 02:25:44740浏览

这一节课学习了制作一个在线的相册管理器

4.9-1.jpg

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jquery在线相册管理器</title>
	<link rel="stylesheet" href="css/style.css">
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/demo.js"></script>
</head>
<body>
	<div class="wrap">
		<div class="header">
			<h2>在线相册管理器</h2>
			<p>
				<label for="img_url">请输入图片地址</label>
				<!-- <input type="text" name="img_url" id="img_url" placeholder="images/demo.jpg"> -->
				<input type="text" name="img_url" id="img_url" placeholder="images/demo.jpg" value="images/zly.jpg">
			</p>
			<p>请选择图片类型:
				<input type="radio" name="border" id="rect" value="0" checked=""><label>矩形</label>
				<input type="radio" name="border" id="radius" value="10%"><label>圆角</label>
				<input type="radio" name="border" id="circle" value="50%"><label>圆形</label>
			</p>
			<p>
				图片是否添加阴影
				<select>
					<option value="0" selected="">不添加</option>
					<option value="1">添加</option>
				</select>
			</p>
			<p><button class="add">添加图片</button></p>
		</div>
		<div class="main">
			<ul></ul>
		</div>
	</div>
</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议