flexble.js简单的demo

最新推荐文章于 2022-11-26 17:53:20 发布

Nomal_Life

最新推荐文章于 2022-11-26 17:53:20 发布

阅读量637

点赞数

分类专栏：移动端插件文章标签：移动 web javascript 插件

本文链接：https://blog.csdn.net/Nomal_Life/article/details/60480390

版权

移动端同时被 2 个专栏收录

1 篇文章 0 订阅

订阅专栏

插件

1 篇文章 0 订阅

订阅专栏

flexble是一个可以动态的添加meta标签的js插件，使用它进行web移动端的开发，html代码如下

<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<!--允许全屏-->
		<meta content="yes" name="apple-mobile-web-app-capable">
		<meta content="yes" name="apple-touch-fullscreen">
		<meta content="telephone=no,email=no" name="format-detection">
		<link rel="stylesheet" type="text/css" href="css/main.css" />
		<link rel="stylesheet" type="text/css" href="js/flexible.debug.css">
		<!-- <script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script> -->
		<script type="text/javascript" src="js/flexible.debug.js"></script>
		<title>再来一波DEMO页</title>

	</head>

	<body>
		<div class="container">
			<div class="banner">
				<img src="img/TB1PNLZKXXXXXaTXXXXXXXXXXXX-750-481.jpg"/>
			</div>
			<ul class="list">
				<li class="list-item">
					<a href="##" class="h-img">
						<img src="img/grayscale.jpg" alt="">
					</a>
					<div class="flag-item h-img">
						<div class="title">
						<a href="##">Carter's1年式灰色长袖连体衣包脚爬服全棉鲸鱼男婴儿童装115G093
						</a>
						</div>
						<div class="price">
							<span>双11价</span>
							<strong>¥299.06</strong>
							<small>(满400减100)</small>
						</div>
						<div class="sellnum">
							1小时内热卖5885件
						</div>
						<div class="qiang">
							马上抢！
						</div>
					</div>
				</li>

				<li class="list-item">
					<a href="##" class="h-img">
						<img src="img/grayscale.jpg" alt="">
					</a>
					<div class="flag-item h-img">
						<div class="title">
						<a href="##">Carter's1年式灰色长袖连体衣包脚爬服全棉鲸鱼男婴儿童装115G093
						</a>
						</div>
						<div class="price">
							<span>双11价</span>
							<strong>¥299.06</strong>
							<small>(满400减100)</small>
						</div>
						<div class="sellnum">
							1小时内热卖5885件
						</div>
						<div class="qiang">
							马上抢！
						</div>
					</div>
				</li>


				<li class="list-item">
					<a href="##" class="h-img">
						<img src="img/grayscale.jpg" alt="">
					</a>
					<div class="flag-item h-img">
						<div class="title">
						<a href="##">Carter's1年式灰色长袖连体衣包脚爬服全棉鲸鱼男婴儿童装115G093
						</a>
						</div>
						<div class="price">
							<span>双11价</span>
							<strong>¥299.06</strong>
							<small>(满400减100)</small>
						</div>
						<div class="sellnum">
							1小时内热卖5885件
						</div>
						<div class="qiang">
							马上抢！
						</div>
					</div>
				</li>

				<li class="list-item">
					<a href="##" class="h-img">
						<img src="img/grayscale.jpg" alt="">
					</a>
					<div class="flag-item h-img">
						<div class="title">
						<a href="##">Carter's1年式灰色长袖连体衣包脚爬服全棉鲸鱼男婴儿童装115G093
						</a>
						</div>
						<div class="price">
							<span>双11价</span>
							<strong>￥299.06</strong>
							<small>(满400减100)</small>
						</div>
						<div class="sellnum">
							1小时内热卖5885件
						</div>
						<div class="qiang">
							马上抢！
						</div>
					</div>
				</li>

				<li class="list-item">
					<a href="##" class="h-img">
						<img src="img/grayscale.jpg" alt="">
					</a>
					<div class="flag-item h-img">
						<div class="title">
						<a href="##">Carter's1年式灰色长袖连体衣包脚爬服全棉鲸鱼男婴儿童装115G093
						</a>
						</div>
						<div class="price">
							<span>双11价</span>
							<strong>￥299.06</strong>
							<small>(满400减100)</small>
						</div>
						<div class="sellnum">
							1小时内热卖5885件
						</div>
						<div class="qiang">
							马上抢！
						</div>
					</div>
				</li>
			</ul>
		</div>
	</body>

</html>