手机h5和小程序切图之不同（h5页面和小程序区别）

bigegpt 2024-11-15 16:27 3 浏览

在做html5和小程序切图的时候，有哪些区别？其实本质差不多，小程序的样式文件wxss 对css做了少许改变，小程序的wxml则是 xml的基础上做了小许改变，切图网qietu.com 告诉你所以如果你对html5/css3足够了解的话，在小程序代码中看到大量的html5的影子。

但是需要了解html5和微信小程序的不同的规则。

一、微信小程序和HTML5的标签区别：

二、wxss 选择器
HTML5 微信小程序
div（标签选择器） view、text、icon、input、image、navigator（标签选择器）
class(类选择器) class
id(id选择器)（效率最高） id(效率最高)
element,element(层级选择器) element,element(层级选择器)
：after（伪类选择器）：after ：before
：frist-child等：frist-child等(不建议（工具过滤易导致页面错乱）)
.class .class .class .class(不建议（工具过滤易导致页面错乱）)
群组选择器群组选择器
后代选择器后代选择器

三、placeholder的区别

小程序中可以直接给placeholder添加样式

四、自适应区别

1、我们用html5写自适应的话需要用到百分比或是函数计算比例，但小程序可以让我们避免了这个麻烦，我们可以用rpx，在ipoone6的开发环境下，1rpx=0.5px;我们采用这个单位就可以在完成后，省掉兼容的一部分问题了。（当然我这里面没有考虑到）
2、这里有个开发中可能遇到的坑，由于背景图是全覆盖的，所以这里可以在wxss文件中添加语句：.indexBox{height:100%;} page{height:100%} 都需要设置，要不然没法自适应，注意大小写。

h5和小程序的区别

上一篇：H5商城和小程序的区别?（h5和小程序一样吗）
下一篇：小程序和H5的区别在哪里?（小程序与h5的区别）

手机h5和小程序切图之不同（h5页面和小程序区别）

相关推荐

idea本地配置连接远程hadoop集群的一些网络问题解决汇总

无缓存不行?例行升级的入门级阿斯加特AN2 SSD装机点评

Ceph运维手册(基于P版本)

大数据开发前要做什么准备?8台Hadoop服务器进行集群规划前配置

Tensorflow分类loss函数总结 tensorflow绘制loss曲线

R语言学习笔记(七) -离散型数据的模型预测2

iOS Runtime详解

7 个对 Java 意义重大的性能指标，你知道几个?

PHP 远程调试最佳实践

Laravel框架使用图片处理简单教程