微信小程序的样式
2017-01-12 09:58
253 查看
微信小程序中css的使用技巧总结
这篇文章介绍了最近很火的微信小程序中css的使用技巧总结,有需要的同学可以参考一下本文微信小程序 css使用技巧
1:用纯CSS创建一个三角形的原理把上、左、右三条边隐藏掉(颜色设为 transparent)
.demo { width:0; height:0; border-width:20px; border-style:solid; border-color:transparenttransparentredtransparent; } |
max-height:550rpx; overflow-y:scroll; |
clip: 修剪文本 ellipsis : 用省略号来代表被修剪的文字 string: 使用给定的字符串来代表被修剪的文字 重点是三个同时使用:text-overflow:ellipsis;white-space:nowrap;overflow:hidden; |
5: margin-bottom失效
margin-bottom是下方的外边距,并不能让元素向下方移动,margin-top作为上边距,把元素“推”了下去。 希望图标距离下方30px,那么可以在ul上设置position:absolute,bottom:30px,(这一句我没有加同样实现了效果)另外父元素position:relative |
white-space:nowrap; |
div{ word-wrap: break-word; word-break:normal; } |
div{ word-break:break-all; } |
相关文章推荐
- 原创:新手布局福音!微信小程序使用flex的一些基础样式属性
- 原创:新手布局福音!微信小程序使用flex的一些基础样式属性
- 微信小程序 JS动态修改样式
- 省市级联和样式优化之极速微信小程序开发,第二天
- 微信小程序: button 修改样式
- 微信小程序 简单DEMO布局,逻辑,样式的练习
- 微信小程序 UI样式基础
- 微信小程序WXSS 尺寸单位、样式导入、内联样式、选择器、全局样式与局部样式
- 微信小程序,动态改变样式
- 微信小程序 动态绑定事件并实现事件修改样式
- 微信小程序学习笔记(8)--------样式基础
- 微信小程序,学习笔记(二)样式(WXSS)及一个简单的小测试用例
- 微信小程序 小程序制作及动画(animation样式)详解
- 源码推荐:iOS开发商品展示的不同样式Demo和微信小程序开源项目库汇总
- 微信小程序自定义轮播图swiper dots默认样式
- 微信小程序入门一: 简 介、文本、事件、样式
- 让微信小程序和页面界面 UI 统一:WeUI 前端样式库
- 微信小程序尺寸单位rpx和样式使用详解
- 微信小程序实现给循环列表添加点击样式