2、微信小程序开发界面

已于 2022-01-25 14:15:01 修改
阅读量963 收藏
点赞数 1
分类专栏： 微信小程序开发 文章标签： 微信小程序 小程序
于 2022-01-25 14:13:29 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43890515/article/details/122684155
版权

2、微信小程序开发界面

  • 针对于上节需要补充的点
    在新建微信小程序时，要注意区分微信公众号IP和微信小程序IP。我们在开发小程序的时候是要用微信小程序IP不然编译不了哈哈哈。

在这里插入图片描述

  • 左边是模拟器的视图，右边是代码编辑页面。右下角调试器页面。

在这里插入图片描述

  • 编辑好的页面：ctrl+s 保存之后就可以编辑。或者点击上面编译按钮。

在这里插入图片描述

  • index.wxss 是定义样式类，一般只作用与index.wxml
  • 在app.wxss是全局样式类，可以在项目中的任何文件中使用
_yummy_
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
[微信小程序专题] 基本页面设置
算法与编程之美
02-01 3769
欢迎点击「算法与编程之美」↑关注我们！本文首发于微信公众号："算法与编程之美"，欢迎关注，及时了解更多此系列文章。问题描述1 最近几年微信小程序特别的火，快捷容易不需要下...
微信小程序简单常见首页demo
祈澈菇凉
07-12 5773
wxml<view class='index-contier'> <view class="index-left"> <view>电池剩余</view> <view>62%</view> </view> <view class
微信小程序+UI框架
互联网小队
02-28 1305
小程序基础样式库、star数为截至2021年1月27日统计 ColorUI 1、start 10.1k 2、鲜亮的高饱和色彩，专注视觉的小程序组件库 3、GitHub 地址：https://github.com/weilanwl/ColorUI 4、开发文档参考（编辑中）：https://www.color-ui.com 5、ColorUI在语雀有个群友共同在维护的知识库，里面有一些群友改的模板和UI素材供开发使用哦！ 6、 语雀-ColorUI群资源、https://www.yuque.com/co.
小程序界面开发（1）
lpabjt的博客
01-21 649
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 欢迎使用Markdown编辑器 你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
手把手教你写第一个微信小程序页面
张居然的博客
08-17 9771
微信小程序，微信小程序项目，手把手教你写第一个微信小程序页面 1.首页效果以及实现步骤新建项目并梳理项目结构配置导航栏效果配置 tabBar 效果实现轮播图效果实现九宫格效果实现图片布局2.接口地址获取轮播图数据列表的接口 【GET】获取九宫格数据列表的接口 【GET】...
微信小程序点餐系统微信小程序开发实战
06-07
项目实战中提供的"点餐demo"可能是已经完成部分功能的源代码，学习者可以通过阅读和修改这些代码，加深对微信小程序开发的理解。同时，也可以参考这个示例来构建自己的点餐系统。 六、小程序开发注意事项 1. 规范...
微信小程序聊天界面demo
最新发布
07-27
这个“微信小程序聊天界面demo”案例涵盖了微信小程序开发的核心技术和实践，对于学习和理解微信小程序的开发流程及原理具有很好的参考价值。通过深入学习和实践，开发者能够掌握创建高效、用户体验优秀的聊天应用的...
微信小程序登录界面设计（可以登录）
12-14
在微信小程序开发中，设计一个有效的登录界面是至关重要的，因为它是用户与应用程序初次交互的地方。这个主题“微信小程序登录界面设计（可以登录）”针对初级开发者，旨在提供一种实现简单登录功能的方法。下面我们...
微信小程序 欢迎界面开发的实例详解
12-29
微信小程序 欢迎界面 市面上大多数的app都会有一个欢迎界面，下面将演示如何通过微信小程序实现一个欢迎界面。 下面将会按照以下的顺序介绍： 布局的实现 逻辑的实现 样式的实现 1.布局的实现 整个布局使用swiper...
学习微信小程序开发文档总结
抗争小青年的博客
10-24 928
根据步骤进行小程序注册，最终获得一个AppID，下载开发者工具，安装后建立第一个小程序项目，填入AppID，才可通过微信扫码进行真机测试。
微信小程序设计用户注册页面
IT-Sun丿的博客
06-21 4万+
Page({ /** * 页面的初始数据 */ data: { text: '获取验证码', //按钮文字 currentTime: 61, //倒计时 disabled: false, //按钮是否禁用 phone: '', //获取到的手机栏中的值 VerificationCode: '', Code: '', N...
2微信小程序的UI设计
qq_36038258的博客
07-18 7357
参考文档： w3cschool:https://www.w3cschool.cn/weixinapp/vuis1q9m.html csdnblog对盒子的介绍:https://www.cnblogs.com/dragondean/p/5922740.html           微信小程序开发文档:https://developers.weixin.qq.com/miniprogram/dev/c...
微信小程序二（创建页面）
不忘初心，才能始终
10-08 2万+
好了 hello world 创建好了 ，咱开始写页面了，那么如何创建一个简单的页面呢， 废话不多说，开始撸代码 新建一个页面需要以下几步， 1. 在pages 中添加一个目录 （当然如果你觉得写在现有的目录里面就好 那这一步就省略啦） 点击左侧的 编辑  -->  点中 pages 文件夹  -->   点击右上角的  +  号  --> 在下拉菜单中选择 目录  --
零基础入门微信小程序开发
热门推荐
GitChat
07-03 34万+
本课程是一个系列入门教程，目标是从 0 开始带领读者上手实战，课程以微信小程序的核心概念作为主线，介绍配置文件、页面样式文件、JavaScript 的基本知识并以指南针为例对基本知识进行扩展，另外加上开发工具的安装、小程序发布等内容，共 9 篇文章。
微信小程序开发----界面样式
Sylvia的博客
04-12 1万+
界面、图标位置 常用样式设置   1）行居中使得容器中的内容在该行中间 .top{ display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center; }   2）按钮样式 比较常规，值得注意的就是这里直接用margin调节了按钮的位置，使得按钮在屏幕偏下方的位置（margin和padd
微信小程序开发：简单列表界面的实现
gsc1456的博客
05-29 1万+
最近，想了解下微信小程序的开发。看了下官网的组件和API介绍，想通过一个简单的列表展示，来学习下如何开发微信小程序。先来看下最后的效果（使用的测试数据，后期可改为http请求返回的数据）。底部的UI在app.json配置tabBar属性具体的实现如下：框架的视图层由 WXML 与 WXSS 编写，由组件来进行展示。定义一个模块，新建一个page，如Index，会生成四个文件，分别如index.js...
微信小程序开发--欢迎界面
朗福德的博客
01-11 4629
前言 最近在学B/S相关的东西,js资料看的头疼了,做了几个小项目也是稀里糊涂的,没有过明白js中的精华.索性就先放下休息一下,看看微信小程序的制作,找了一套视频,跟着视频中老师讲的来模仿着做了一个界面. 正文 开发环境 微信官方推出了小程序的IDE开发环境,大家可以去网站上下载,这个安装就很简单了,默认安装就可以了 这个是登录后的界面,选择小程序项目进入IDE开发环境. 界面大概就是长这个样子...
微信小程序开发入门指南
这个工具集成了代码编辑、预览、调试等功能，是开发微信小程序不可或缺的辅助软件。通过这个工具，开发者可以编写小程序的主要构成部分，包括： 1. WXML：这是一种类似于HTML的标记语言，用于定义小程序的结构和...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值