用css编写三角和半圆形状样式
1.三角样式
htriangle-down {
height:;
border-left:11rpx solid transparent;
border-right:11rpx solid transparent;
border-top:12rpx solid #475669;
}
2.半圆
html :
<view class="user-divide">
<view class="user-divide-line"></view>
</view>
css:
/* 下面的圆角 */
.user-divide {
position: relative;
height: 40rpx;
width: 90%;
left: 5%;
background: #fff;
}
.user-divide:before {
left: -10rpx;
}
.user-divide:after {
right: -10rpx;
}
.user-divide:before, .user-divide:after {
position: absolute;
top:;
content: "";
width:36rpx;
height: 36rpx;
background-color: #5AA2E7;
border-radius: 50%;
}
.user-divide-line {
position: absolute;
top: 50%;
margin-top: -1px;
border-top: 1px dashed #E0E6ED;
width: 90%;
left: 5%;
right: 5%;
}
3.字体后面的箭头
/* 箭头 */ .m-list-item.has-arrow::after {
content: " ";
display: inline-block;
height: 18rpx;
width: 18rpx;
border-width: 2rpx 2rpx 0 0;
border-color: #8492A6;
border-style: solid;
position: absolute;
top: 50%;
right: 30rpx;
}
用css编写三角和半圆形状样式的更多相关文章
- HTML+CSS编写规范
在任何一个项目或者系统开发之前都需要定制一个开发约定和规则,这样有利于项目的整体风格统一.代码维护和扩展.由于Web项目开发的分散性.独立性.整合的交互性等,所以定制一套完整的约定和规则显得尤为重要. ...
- 个人css编写规范
前言:最近在做微信小程序,因为公司小,就我一个人弄前端的东西,js和页面都是我来弄,结果那天后台的人看到我的js代码,说我的代码写得不规范,函数什么的都很乱,弄得我羞愧难当,幸亏没看我的css,其实我 ...
- CSS编写指导规范和建议
在参与规模庞大.历时漫长且参与人数众多的项目时,所有开发者遵守如下规则极为重要: 保持 CSS 易于维护 保持代码清晰易懂 保持 CSS 的可拓展性 为了实现这一目标,我们要采用诸多方法. 本文档第一 ...
- css编写规范最佳实践
最初,在编写CSS的时候,我们往往想到哪儿就写到哪儿,它们之间的关联性和有序性并不在考虑之中.但随着代码量的增加,亦或是多人共同开发,CSS的编写规范变得重要起来了.本文通过三个方面,总结出CSS编写 ...
- 纯CSS打造好看的按钮样式
好看的按钮.链接.div样式,效果预览: http://hovertree.com/code/run/css/s8o19792.html 发现今天积分和排名不错: 代码如下: <!DOCTYPE ...
- 使用css打造形形色色的形状!
使用css打造形形色色的形状! css是非常强大的工具,如果我们掌握的好,那么许多复杂的形状不需要使用图片而直接使用css完成即可,这不仅有利于减少http请求以增强性能还便于日后的管理和维护,一举两 ...
- div css仿京东订单流程图样式代码
效果展示 http://hovertree.com/texiao/css/25/ 本效果适合PC,也适合移动端 手机扫描二维码查看效果: 效果图: 代码如下: <!DOCTYPE html> ...
- 使用jquery修改css中带有!important的样式属性
当CSS中含有!important的样式属性时,普通的修改方式是会出现失败的.如下: <div class="test">使用jquery修改css中带有!import ...
- css编写注意事项(不定时更新)
CSS的编写是需要积累的,而一个好的css编写习惯对我们将来的成长是非常有利的,我会把我平时看到的或者遇到的会不定时的更新到这里,不时翻一下,但求有所进步. 如果各位看官也有看法和建议,评论下,我也会 ...
随机推荐
- Spring AOP junit错误整理
1.[spring][Xlint:invalidAbsoluteTypeName]error 首先说一下最基本的错误,使用AOP的pointcut的expression表达式必须是正确的,表达式规则相 ...
- django 通过模型类操作数据表(基础增删改查)
进入项目shell的命令: python manage.py shell 以下为在相互shell终端中演示的例子: 首先导入模型类:(from 应用名.models import 类名) from b ...
- 实现Servlet接口
1 右键项目->Build Path->Configure Build Path 2 Add Library...->Server Runtime 3 Apache Tomcat-& ...
- python3下import MySQLdb出错问题
原因:python2下是使用的MySQLdb,python3下用的是pymysql 安装 pip install pymysql
- 【VS开发】DLL和ocx的区别
ActiveX,OLE是基于COM的一种应用,其文件后缀一般以dll和ocx结尾:ocx作为一种特殊的dll文件,具有一定的用户界面和事件响应,而dll文件只是方法和属性的集合. 一.关于DLL的介绍 ...
- lambda得用法
- String,StringBuffer,StringBulider 三者的区别
1.String 是字符串常量,StringBuffer 和StringBuilder 是字符串变量. 2.运行速度 StringBuilder > StringBuffer > Stri ...
- (5.1.4)引擎管理——SSMS管理使用小技巧
目录 [1]自带报表 [2]对象管理器详细信息 [3]日志 [4]活动监视器 [1]自带报表 无论是数据库.服务器实例.还是代理等等都可以有标准报表 [2]对象管理器详细信息 利用改方式,可以很有效的 ...
- docker:相关命令
1.查看正在运行的容器 docker ps docker ps -a 查看所有的容器,包括已经停止了的 2.WORKDIR Dockerfile中的WORKDIR指令用于指定容器的一个目录,容器启动时 ...
- 087、日志管理之 Docker logs (2019-05-09)
参考https://www.cnblogs.com/CloudMan6/p/7749304.html 高效的监控和日志管理对保持生产系统只需稳定的运行以及排查问题至关重要. 在微服务架构中,由 ...