微信小程序 添加分割线

最新推荐文章于 2024-06-26 15:35:08 发布
最新推荐文章于 2024-06-26 15:35:08 发布
阅读量4.4k 收藏 12
点赞数 8
分类专栏： 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dwp10000/article/details/123138610
版权

微信小程序 小程序

效果图：
在这里插入图片描述
代码参考如下：

	<view style="display: flex;margin-top:50rpx ;">
      <view style="background-color: lightgray; width: 100%; height: 5rpx;"></view>
    </view>

已做尝试：如果把width=100%去掉也不会显示；
【好文共赏析！】

小火奋进
关注
  • 8
    点赞
  • 踩
  • 12
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序开发：如何快速实现添加一条分割线的项目需求
软贱开发攻城狮
02-04 4555
在微信小程序开发的时候，有些需求是参照移动端开发来设计的，基本上微信小程序就是基于微信的移动端应用，所以基本上各种需求都和移动端开发是一样的，类似程度非常高。 本篇博文就来分享一下，在微信小程序开发的时候，关于分割线的实现效果。这个需求非常常见，但是为什么还要单独拿出来分享一下呢，就是因为这个需求很普遍，而且对于刚入门的新手来说有一些问题，所以只要有需求就肯定有需要，只分享给有需要的人。 1、home.wxml文件 这里分享两种写法，第一种直接画分割线，第二种用一个标签包一下再画分割线。 （1.
微信小程序--分割线
weixin_44531304的博客
04-04 1万+
水平分割线 –wxml– <view class="container"> <!-- 分割线 --> <view class="divLine"></view> </view> –wxss– /*分割线样式*/ .divLine{ background: #E0E3DA; width: 100%; height: 5...
微信小程序写个人主页、增加分割线、布局&样式（源代码示例）
zhang___jian61的博客
03-13 1156
记得所有的页面必须在app.json中创建修改，否则一切编写都是徒劳（吐血获得的真知。欢迎有兴趣的同学借鉴学习，图片资源换成自己的就行，本地外链都可。记得刚开始编写的时候较为生疏，如今基本能做到看到效果写出源代码。每天进步一点，学习永无止境~
【微信小程序】要在两个＜view＞之间绘制一条分割线，使用border属性和样式
资深全栈开发工程师
07-20 3432
类中的样式，可以更改分割线的宽度、高度、颜色等。请根据实际需要进行调整。属性以及适当的样式设置。属性，使内容自动填充剩余空间，并居中对齐。类设置了分割线的宽度、高度和背景颜色。标签作为容器，内部包含两个内容。属性，使内容和分割线水平排列。之间绘制一条分割线，可以使用。在上述代码中，使用了一个。
微信小程序——漂亮的分割线（分隔线）
wy313622821的博客
11-03 2万+
首先来看看效果图： 实战应用中，在这个小程序里运用到，感兴趣的朋友可以进去参考（界面做得还是蛮好的）： 实现这个功能主要分3部分组成，两个view和一个text 下面来看看代码： .wxml代码 <view class="view_fengexian"> <view ></view> <text class="text_fengexian">*改变线条颜色*</text> <view ></view> </v
手把手带你学习微信小程序 —— （微信小程序常用代码块）
2401_84048586的博客
04-07 2212
/ 属性被改变时执行的函数（可选），也可以写成在methods段中定义的方法名字符串, 如：‘_propertyChange’// 通常 newVal 就是新设置的数据， oldVal 是旧数据。
微信小程序 如何添加一条分割线
热门推荐
信徒博客
05-17 3万+
<view class="container"> <!-- 分割线 --> <view class="divLine"></view> </view> /*分割线样式*/ .divLine{ background: #E0E3DA; width: 100%; height: 5rpx; } ...
微信 小程序 折线图
jweicao的博客
05-30 717
wx-chart 折线图 引入插件 这里是链接 https://github.com/xiaolin3303/wx-charts/issues/58 **首先在 js 页面 引入插件 ** var wxCharts = require('./../../utils/wxcharts.js'); **再接着 就是 ** /** * 页面相关事件处理函数--监听页面加载事件 */ onShow() { wx.request({ url: 'http://www.tp
小程序 竖线节点 效果
08-11
在微信小程序的开发中，有时候我们需要创建一种特定的视觉效果，比如时间轴或者列表中的分隔标记，这就是所谓的“竖线节点”或“分割线节点”效果。这种效果通常用于展示一系列按照时间顺序排列的事件，或者区分不同...
微信小程序实现转盘抽奖
10-14
在微信小程序中实现转盘抽奖是一项常见的功能，用于增加用户互动性和趣味性。下面将详细介绍如何使用微信小程序来创建一个转盘抽奖应用。 首先，我们需要理解微信小程序的基本结构。微信小程序由WXML（WeiXin ...
一个很简单的划线小程序
03-03
一个简单的划线程序，基于MFC的界面，比较简单可以根据自己的需要添加
微信小程序基于canvas的自定义地图控件，实现瓦片地图等SimpleMap-wx-master.zip
09-25
在微信小程序中，开发者可以利用丰富的API和组件来构建各种功能丰富的应用，其中包括地图功能。在给定的压缩包文件“SimpleMap-wx-master.zip”中，包含了一个名为“SimpleMap-wx-master”的项目，该项目专门针对...
菜谱微信小程序源码 外卖广告推广教程
12-23
3、打开微信开发者工具添加小程序-把解压的源码添加进去-appid改成自己小程序的 4、在pages/index/index.js文件搜流量主广告改成自己的广告ID 5、到微信公众平台登陆自己的小程序-开发管理-开发设置-服务器域名...
微信小程序wepyjsNavBar组件
08-10
微信小程序是一种轻量级的应用开发框架，它允许开发者利用JavaScript、WXML（微信小程序标签语言）和WXSS（微信小程序样式语言）来构建在微信环境中运行的应用。在微信小程序的开发过程中，`wepyjs` 是一个流行且...
html 分割线_微信小程序 html代码转小程序代码
weixin_39611754的博客
11-03 138
最近在开发小程序 出现了一个问题 就是后端返回富文本样式html标签代码 因为小程序不支持html代码，在网上找到了个办法 有一个插件wxParse​github.com 但是这个插件已经停止维护了 但是很管用的下面是方法 你可以用克隆下来 但是时间太长了 推荐直接下载下载完成之后 把下面我圈住的代码复制到小程序的根目录下复制之后是这样的然后在进行配置下面是wxml的配置<下面是...
微信小程序——分割线
qq_46586512的博客
08-30 1595
水平分割线 1、(.wxml） <view class="container"> <view class="heng"></view> </view> 2、（.wxss） .heng{ background: #E0E3DA; width: 100%; height: 5rpx; } 垂直分割线 1、（.wxml） <view class="container"> <view class="Line
微信小程序分隔线
qq_45155741的博客
08-04 3138
微信小程序分隔线，复制粘贴后再添加class="hr"直接使用 /* 分隔线 */ .hr { width: 90%; height: 3rpx; margin-top: 15rpx; margin-left: 37.5rpx; background-color: #dfdedd; }
CSS：微信小程序实现一个列表，一行放两个元素，每两个元素后面加分割线，最后一行后面不加分割线
奶绿走糖的博客
12-15 2351
CSS：微信小程序实现一个列表，一行放两个元素，每两个元素后面加分割线，最后一行后面不加分割线
【Uniapp微信小程序】图片左右分割/分割线切割图片/图片批量分割线切割
最新发布
cnsv的博客
06-26 452
uniapp微信小程序图片左右分割切割方法组件，使用分割线分割，默认分割线中间
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值