微信小程序开发 Day02

最新推荐文章于 2022-12-18 12:17:45 发布

SILIII

最新推荐文章于 2022-12-18 12:17:45 发布

阅读量226

点赞数

分类专栏：大学

本文链接：https://blog.csdn.net/SILIII/article/details/92801688

版权

任务：1、骰子布局，把整个骰子做出来到页面上；

2、按照要求将小程序完成，能在手机上看或能在开发者工具调试即可。

1、骰子布局，把整个骰子做出来到页面上

这个任务分为了两个形式，一种在sublime中实现了骰子布局，下面为源代码：

HTML源代码：

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<!-- 移动端页面的适配 -->
	<meta name="viewport" content="width=divice-width,initial-scale=1.0">
	<title>骰子布局</title>
	<link rel="stylesheet" href="random.css">
</head>
<body>
<div class="first-face">
  <span class="pip"></span>
</div>
<div class="second-face">
  <span class="pip"></span>
  <span class="pip"></span>
</div>
<div class="third-face">
  <span class="pip"></span>
  <span class="pip"></span>
  <span class="pip"></span>
</div>
<div class="fourth-face">
  <div class="column">
    <span class="pip"></span>
    <span class="pip"></span>
  </div>
  <div class="column">
    <span class="pip"></span>
    <span class="pip"></span>
  </div>
</div>
<div class="fifth-face">
  <div class="column">
    <span class="pip"></span>
    <span class="pip"></span>
  </div>
  <div class="column">
    <span class="pip"></span>
  </div>
  <div class="column">
    <span class="pip"></span>
    <span class="pip"></span>
  </div>
</div>
<div class="sixth-face">
  <div class="column">
    <span class="pip"></span

最低0.47元/天解锁文章

SILIII

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
微信小程序开发 Day02

任务：1、骰子布局，把整个骰子做出来到页面上； 2、按照要求将小程序完成，能在手机上看或能在开发者工具调试即可。1、骰子布局，把整个骰子做出来到页面上这个任务分为了两个形式，一种在sublime中实现了骰子布局，下面为源代码：HTML源代码：<!DOCTYPE html><html><head> <meta ...
复制链接

扫一扫