- 综合排序
- 最热优先
- 最新优先
h5页面制作，什么是H5页面？
H5页面设计与制作是指利用HTML5技术进行网页设计和开发的过程。HTML5作为最新的HTML标准，带来了许多新的特性和功能，使得网页设计更加灵活、互动性更强，并且能够在各种设备上提供一致的用户体验。 下面我们将详细介绍H5页面设计与制作的概念、特点、应用以及如何入门。什么是H5页面设计与制作？H5页面设计与制作是指使用HTML5、CSS3和JavaScript等技术来创建和优化网页的过程。 H5页面的特点跨平台兼容性：H5页面可以在PC、平板、手机等多种设备上运行，提供一致的用户体验。多媒体支持：HTML5支持音频、视频、图形等多媒体元素，无需依赖第三方插件。 在线教育：H5页面可以嵌入视频、音频、动画等教学资源，增强学习体验。如何入门H5页面设计与制作？学习基础知识：首先需要掌握HTML、CSS和JavaScript的基础知识。 关注用户体验：设计时要考虑用户的使用习惯和体验，确保页面加载速度、交互流畅性等。总结H5页面设计与制作不仅仅是技术的进步，更是用户体验的提升。
25K32编辑于 2025-02-13- 来自专栏学习/读书笔记
《Flutter》-- 5.Flutter页面布局
参阅书籍： 《Flutter跨平台开发入门与实践》-- 向治洪（著） 5. Flutter页面布局 5.1 盒约束模型 盒约束是指组件可以按照指定限制条件来决定如何布局自身位置。 height: 100, child: Container( width: 80, height: 5, 2）mainAxisSize：表示主轴应该占用多大空间； 3）crossAxisAlignment：表示子组件在交叉轴的对齐方式； 4）textDirection：表示子组件在主轴方向上的布局顺序； 5） 主轴的方向； 2）mainAxisAlignment：子组件在主轴的对齐方式； 3）mainAxisSize：主轴占用的空间大小； 4）crossAxisAlignment：子组件在交叉轴的对齐方式； 5） 5.4 流式布局 流式布局指的是页面元素的宽度可以根据屏幕的分辨率适配调整，但整体布局风格保持不变。
1.4K20编辑于 2022-04-07 - 来自专栏采云轩
H5 页面列表缓存方案
前言 在 H5 日常开发中，会经常遇到列表点击进入详情页面然后返回列表的情况，对于电商类平台尤为常见，像我们平常用的淘宝、京东等电商平台都是做了缓存，而且不只是列表，很多地方都用到了缓存。 但刚才说的都是 App，在原生 App 中，页面是一层层的 View，盖在 LastPage 上，天然就能够保存上一个页面的状态，而 H5 不同，从详情返回到列表后，状态会被清除掉，重新走一遍生命周期， localStorage 是一种方式，提供的 getItem、setItem 等 api 也足够支持存取操作，最大支持 5M，容量也够，通过序列化 Serialize 整合也可以满足需求，另外 IndexDB 也不失为一种好的方式，WebSQL 已废弃，就不考虑了，详细可点击张鑫旭的这篇文章《HTML5 indexedDB前端本地存储数据库实例教程》(https://www.zhangxinxu.com/wordpress /2017/07/html5-indexeddb-js-example/)查看对比。
2.2K20发布于 2021-04-08 - 来自专栏deepcc
html5页面头部
-- 尺寸的设置以及页面是否允许缩放 --> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale -- 忽略<em>页面</em>中的数字识别为电话,忽略email识别 --> <meta name="format-detection" content="telephone=no, email=no"/> <!
2K20发布于 2018-07-05 - 来自专栏deepcc
html5页面头部
-- 尺寸的设置以及页面是否允许缩放 --> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale -- 忽略<em>页面</em>中的数字识别为电话,忽略email识别 --> <meta name="format-detection" content="telephone=no, email=no"/> <!
2.2K70发布于 2018-05-16 - 来自专栏coding for love
5-13 多页面打包配置
简介 前面的配置基本上是基于 spa，不过如果细心的同学可能会发现，之前在 5-5 webapck-dev-server 解决单页应用路由问题 一文中已经用到了多页面打包。 配置多页面 const HtmlWebpackPlugin = require('html-webpack-plugin'); const { CleanWebpackPlugin } = require
62210发布于 2020-06-02 - 来自专栏卓越笔记
H5页面唤醒 支付宝App 指定页面
appId=20000307”;暗号 —400 参考资料 H5页面唤醒支付宝 app指定页面_daxiong0816的博客-程序员秘密 - 程序员秘密 (cxymm.net) URLScheme 之 支付宝
6K20编辑于 2023-02-18 - 来自专栏前端Q
Webpack5构造React多页面应用
来源 | https://github.com/zhedh/react-multi-page-app/ 介绍 react-multi-page-app是一个基于webpack5构造的react多页面应用 为什么建造多页面应用： 多个页面之间业务互不关联，页面之间并没有共享的数据 多个页面使用同一个一个服务，使用通用的组件和基础库 建造多页面应用的好处： 保留了传统单页应用的开发模式：支持补充打包，你可以把每个页面看成是一个单独的单页应用 独立部署：每个页面相互独立，可以单独部署，解压缩项目的复杂性，甚至可以在不同的页面选择不同的技术栈 减少包的体积，优化加载渲染流程 快速上手 克隆 git clone https://github.com ，查看完整代码react-multi-page-app 入口配置和模版自动匹配 为了不用每次补充页面都要添加入口页面配置，我们将入口配置改成自动匹配 入口文件自动匹配 cd config touch webpack.util.js 我们项目中没有安装webpack-cli，webpack会进行交替使用的webpack-cli，webpack5和webpack-cli3不兼容 解决：升级版本webpack-cli3到webpack-cli4
4.3K20发布于 2021-01-07 - 来自专栏腾讯大讲堂的专栏
玩转HTML5移动页面(优化篇)
承接上期讲堂君推荐的《玩转HTML5移动页面（动效篇）》，动效篇说的是让页面动起来的一些小技巧。 而页面动起来的根基是功能可用的页面，因此有必要分享一些优化细节的技巧和方向，熟悉掌握一些方法论还是会对页面开发大大提高效率的，并且也能防止疏忽缺漏。 先审视设计稿，因为320派系的原因，大部分设计稿只考虑到IPHONE5来设计，因此很多背景元素是只有320px宽度（页面实际渲染宽度），例如下图。 ? 5分享接口 H5做好了，要传播分享才能展示你的牛逼轰轰。 然而分享其实是个坑，分享到微信、手Q等都有各种问题。 5.优化目录结构和URL。你的URL应该有语义性，简短易懂，例如http://www.apple.com/macbook-air/，而且每一层级都要有它对应的页面展示以及语义。
3.7K70发布于 2018-02-12 - 来自专栏learn-anything.cn
HTML页面跳转的5中方式！
window.opener是指向前一个页面，这样就可以控制前一个页面。 譬如：当新旧页面在同一个域名下时，在新页面控制台输入 window.opener.alert(1) ，会发现旧页面弹出消息1 。 当新旧页面不在同一个域名时，通过window.opener.location.replace 可以改变旧页面的url。 相关链接 window 对象详细说明 window.opener 对象详细说明 --- 页面跳转传递参数 # 传参页面 let a = { key:'value' } // 对参数进行序列化 5中方式！
3.1K20编辑于 2021-11-27 - 来自专栏linux运维
什么是H5页面？
一、H5页面是啥？H5页面，全称是HTML5页面，是用HTML5（超文本标记语言第5版）技术开发的网页。跟传统网页比，H5页面更轻巧、互动性更强，特别适合在手机、平板上浏览。 举个例子，你在微信里点开那种活动邀请函、品牌宣传页、抽奖页面，带动画、滑动效果、背景音乐的，那些多半就是H5页面！ 二、H5页面的特点跨平台：不管是安卓、iOS，还是PC，H5页面都能跑，只要有浏览器就行。互动性强：支持触摸、滑动、点击等操作，还能加动画、视频、音频，体验像玩游戏一样。 广告：微信朋友圈广告、短视频平台跳转页，H5页面是主力。四、H5页面咋做的？想做H5页面？大概分这几步：策划内容：先想好页面要干啥，比如宣传产品还是搞活动，定好主题和风格。 整个页面加点背景音乐，分享到微信群，吸引用户点开玩。这种页面用H5做，成本低、效果好，传播快！七、想学H5页面制作？
5.6K31编辑于 2025-07-31 - 来自专栏帅哥哥写代码
基于h5+ angularjs页面拖拽实现
背景 一个朋友想做一个页面拖拽功能，我去百度一哈，找到一些资料。但是看了半天没看明白。感觉写的比较麻烦。我就反手百度h5拖放，发现h5已经提供一些拖放事件，于是自己反手写了一个。 正题 1.h5提供的拖放事件 设置元素为可拖放 首先，为了使元素可拖动，把 draggable 属性设置为 true ：
拖动什么 - ondragstart 1,src:'image/0.jpg'},{id:2,src:'image/2.jpg'},{id:3,src:'image/3.jpg'},{id:4,src:'image/4.jpg'},{id:5, 所以只需要操作图片数组的顺序就可以实现页面上交换图片位置）。 ); //获取$scope变量 $scope = angular.element(appElement).scope(); 获取到$scope我们就可以想干啥干啥了 2.当改变了数组数据时，如何使页面动态更新
2K20发布于 2019-04-16 - 来自专栏用户画像
微信H5 页面 ul li
text-align: center; -webkit-text-size-adjust: none; background: #F5F5F5 width: 8px; height: 8px; right: 10px; margin-top: -5px height="22px">
<div style="padding:<em>5</em>px 2.4K20发布于 2018-08-24来自专栏腾讯大讲堂的专栏H5运营类页面设计浅谈
在这里聊一下对H5运营类页面设计的观察和思考，抛砖引玉。 一. 简介 H5运营类页面设计，是指用来承载运营活动、品牌活动或信息传递的移动端页面设计；具有展示空间小、时间碎且短、操作可互动的特点；直接目的是引起用户病毒式分享，从而提升活跃度和品牌形象。 2014年刷爆朋友圈的十大 HTML5 技术案例》 http://www.uisdc.com/2014-friend-circle-html5-cases 2. 《5媚娘传奇！ H5移动端页面设计心得分享》 http://www.uisdc.com/html5-case-experience-summary 3. Html5页面赏析 from Reeoo Topic http://topic.reeoo.com/?
2.5K60发布于 2018-02-12来自专栏少年郎编程之路安卓H5页面软键盘顶起页面底部
最近在维护一些老的页面，发现有一个解决安卓输入法软键盘导致页面布局异常的写法挺好的，跟大家分享一下1. 今天我们要讨论的也是一个兼容性问题，当安卓h5页面里遇到输入框的时候，输入法弹出的时候，浏览器会调整布局，导致底部的UI被顶上来，具体如下图图片 这里页面的代码其实很简单，就是一个输入框，一个fixed
5.3K30编辑于 2023-04-18来自专栏啄木鸟软件测试H5页面测试总结
H5页面的一些通用测试方法进行总结分享给大家。 H5页面介绍 1. H5页面 H5即 HTML5，是最新的 Web 端开发语言版本，大多数手机 APP 页面会用 H5 实现，包括 PC Web 站点也会用它开发实现。 H5其实就是：移动端Web页面。 H5应用在很多地方，如APP的活动专题页面、新闻页面、微信公众号文章页面等都属于H5页面，在PC或者手机浏览器都可以直接访问H5页面。 如何识别H5 从视觉效果上看，H5页面与APP native页面是一样的，因此测试时经常会问到一个问题，这个页面是不是H5页面？如何识别呢？ ，能自适应，并且布局不会乱掉，通常情况也属于H5页面； 3）H5页面在PC端也是能访问的，chrome对H5支持最好，功能的测试可以在PC端chrome下先测试，也可以在手机上直接测试。
2.3K21发布于 2019-12-12来自专栏Android小菜鸡H5 原生JS页面传值
post页面： window.location.href=encodeURI('workList.html? title=aaa&name=吴思源'); Recive页面： var url = decodeURI(location.search); var Request = new Object(); if( split("=")[1]); } } alert(Request["title"]) alert(Request["name"]) 注意： 传值中文时，会出现乱码现在，我们可以在post页面用
7K30发布于 2018-09-06来自专栏搜狗测试H5页面测试总结
前言 在最近几个项目中，小编接触了较多关于H5页面的测试，H5页面的测试除了业务逻辑功能测试外，其他部分的测试方法基本是可以通用的，在此对H5页面的一些通用测试方法进行总结分享给大家。 H5页面介绍 1. H5页面 H5即 HTML5，是最新的 Web 端开发语言版本，大多数手机 APP 页面会用 H5 实现，包括 PC Web 站点也会用它开发实现。 H5其实就是：移动端Web页面。 H5应用在很多地方，如APP的活动专题页面、新闻页面、微信公众号文章页面等都属于H5页面，在PC或者手机浏览器都可以直接访问H5页面。 如何识别H5 从视觉效果上看，H5页面与APP native页面是一样的，因此测试时经常会问到一个问题，这个页面是不是H5页面？如何识别呢？ ，并且布局不会乱掉，通常情况也属于H5页面； 3）H5页面在PC端也是能访问的，chrome对H5支持最好，功能的测试可以在PC端chrome下先测试，也可以在手机上直接测试。
1.7K20发布于 2019-10-28来自专栏编程之旅H5 页面 iPhoneX 刘海屏适配
safe-area.png 很明显，在讨论适配之前，我们的页面一般有两种分类： 1、H5 页面使用原生 App 的 Navigation Bar 导航栏，此时，status bar 状态栏和导航栏都是原生控件 2、H5 页面在 iOS 中占据全屏页面，在这种情况下，除了要兼顾底部小黑条，我们还要处理页面上部跟 状态栏接触的部分，避免内容出现在状态栏上。 页面适配 在为页面适配刘海屏之前，我们首先得在页面的 meta 中添加一个新的值：viewport-fit=cover <meta name="viewport" content="viewport-fit 看一页目前的<em>页面</em>效果： ? WX20200531-205514@2x.png 可以看到现在我们的测试<em>页面</em>已经铺满了整个屏幕。 这个时候，我们来使用之前提到的 env 函数，适配刘海屏幕。 当你的<em>页面</em>不使用原生导航栏铺在整个屏幕中时，这就是一个不错的适配方案。
5K40发布于 2020-06-02来自专栏编程vuejs开发H5页面总结
最近参与了APP内嵌H5页面的开发，这次使用vuejs替代了jQuery，仅仅把vuejs当做一个库来使用，效率提高之外代码可读性更强，在此分享一下自己的一些开发中总结的经验。 之前介绍了一篇关于移动端rem布局方案，这大致是网易H5的适配方案。不过实践中发现淘宝开源的可伸缩布局方案效果更好且更容易使用。 但这也有特例，比如对于一些活动注册页面，需要在一屏幕内完全显示，没有下拉，这时候所有众向或者横向都应该使用rem作为单位。 这样多个表单绑定数据问题解决了，那么怎么进行页面间数据传递？ 原文：http://www.huzerui.com/blog/2017/07/03/vuejs-develop-h5-experience/
2.6K90发布于 2018-01-15腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059
粤公网安备44030502008569号腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号