Web前端
Web前端
马踏飞燕&lin_li
博客地址以迁移:https://linli1724647576.github.io/
展开
-
Flex布局实战:支付宝首页
Flex布局实战:支付宝首页index.wxml<view class="container"> <!-- 蓝色部分 --> <view class="blue-group"> <!-- 顶部部分 --> <view class="top-group"> <!-- 左边搜索框 --> <view class="search-group"> <input class="search-i原创 2020-07-05 23:18:05 · 997 阅读 · 0 评论 -
详解Flex布局
Flex布局flex 布局是继 标准流布局 、 浮动布局 、 定位布局 后的第四种布局方式。这种方式可以非常优雅的实现子元素居中或 均匀分布,甚至可以随着窗口缩放自动适应。 flex 布局在浏览器中存在一定的兼容性。但是在小程序中,是完全兼容 flex 布局的,并且微信官方也是推荐使用 flex 布局的。一些基本概念弹性容器:包含着弹性项目的父元素。通过设置 display 属性的值为 flex 或 inline-flex 来定义弹性容器。弹性项目(Flex item):弹性容器的每个子元素都称原创 2020-07-05 13:09:14 · 325 阅读 · 0 评论 -
HTML + CSS + JS 实现随机抽奖
HTML + CSS + JS 实现随机抽奖HTML<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=ed原创 2020-07-02 15:47:46 · 1747 阅读 · 0 评论 -
JS 实现拖拽效果
JS 实现拖拽效果拖拽原理HTML<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #box{ position: absolute; left: 100px; top: 100px; width: 100px; heigh原创 2020-07-02 09:49:28 · 157 阅读 · 0 评论 -
HTML+CSS+JS实现小学四则运算自动出题程序
HTML+CSS+JS实现小学四则运算自动出题程序要求编写一个小学四则运算自动出题程序要求:1、100以内四则运算,题目自动生成;2、页面需要有计算结果输入框,提交按钮;3、用户提交结果之后系统能自动计算成绩;4、系统能提示用户答错的题号,可以在答错的题号后做一个标记。代码HTML<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></tit原创 2020-07-01 23:58:02 · 3480 阅读 · 1 评论 -
HTML+CSS实现导航栏
HTML+CSS实现导航栏HTML<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> /* 初始化 */ * { margin: 0; padding: 0; } body, html { font-si原创 2020-06-28 22:20:57 · 936 阅读 · 0 评论 -
HTML+CSS实现课程表
HTML+CSS实现课程表HTML<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> table{ border: 4px solid orange; margin: 0 auto; border-spacing: 0; width: 6原创 2020-06-27 23:24:16 · 1700 阅读 · 0 评论 -
HTML+CSS实现百度网盘首页
HTML+CSS实现百度云盘首页HTML<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="./css/index.css" /> </head> <body> <!-- 头部信息 -->原创 2020-06-27 23:22:20 · 4561 阅读 · 0 评论 -
HTML+CSS 实现百度首页
HTML+CSS 实现百度首页HTML<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>百度一下,你就知道</title> <link rel="stylesheet" type="text/css" href="./baidu.css"/> </head> <body> <!DOCTYPE html原创 2020-06-27 23:20:10 · 2772 阅读 · 0 评论