话不多说上效果图：

css:

font-family: PingFang-SC-Heavy, PingFang-SC;

font-weight: 800;

color: #2160AD;

border-left: 4px solid #165097;

background-image: linear-gradient(45deg,transparent 89%, #fff 5%), linear-gradient(-36deg, #fff 10%, #F5F7FA 11%);

css3实现背景三角形样式的更多相关文章

  1. CSS3透明背景+渐变样式

    CSS3透明背景+渐变样式 转载自博文:<CSS3透明背景+渐变样式> http://blog.csdn.net/netbug_nb/article/details/44343809 效果 ...

  2. CSS3 background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  3. 纯css3手机页面图标样式代码

    全部图标:http://hovertree.com/texiao/css/19/ 先看效果: 或者点这里:http://hovertree.com/texiao/css/19/hoverkico.ht ...

  4. CSS3之背景剪裁Background-clip

    CSS3之背景剪裁Background-clip是CSS3中新添加的内容.这个属性还是比较简单的,主要分五个属性值:border.padding.content.no-clip和text.下面将针对这 ...

  5. 基于CSS3动态背景登录框代码

    基于CSS3动态背景登录框代码.这是一款基于jQuery+CSS3实现的带有动画效果的动态背景登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class ...

  6. 认识CSS3新增选择器和样式

    前端之HTML5,CSS3(二) CSS3新增选择器和样式 CSS3新增选择器 结构伪类选择器 :first-child:选取父元素中的第一个子元素的指定选择器 :last-child:选取父元素中的 ...

  7. CSS3之背景定位原点background-origin

    背景定位原点background-origin是CSS3新添加的有关背景的属性,主要是改变背景起始的原点位置的.CSS3之背景定位原点background-origin的属性值有三个:border.p ...

  8. 36种漂亮的CSS3网页按钮Button样式

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  9. css3 设置滚动条的样式

    ::-webkit-scrollbar { width: 14px; height: 14px; } ::-webkit-scrollbar-track, ::-webkit-scrollbar-th ...

  10. jQuery和CSS3炫酷GOOGLE样式的用户登录界面

    这是一款使用jQuery和CSS3打造的GOOGLE样式的用户登录界面特效.该登录界面特效中,右上角的小问号和错误提示小图标使用SVG来制作.username和password输入框採用浮动标签特效. ...

随机推荐

  1. go 通过指针修改结构体小写字段的值

    package main import ( "fmt" "unsafe" ) type W struct { b int32 c int64 } func ma ...

  2. SQL KEEP 窗口函数等价改写案例

    一哥们出条sql题给我玩,将下面sql改成不使用keep分析函数的写法. select deptno, ename, sal, hiredate, min(sal) keep(dense_rank f ...

  3. kubernetes命令补全k8s命令补全

    echo "source <(kubectl completion bash)" >> ~/.bashrc source <(kubectl complet ...

  4. Qt-FFmpeg开发-打开本地摄像头录制视频（7）

    音视频/FFmpeg #Qt Qt-FFmpeg开发-打开本地摄像头录制视频[软解码+ OpenGL显示YUV] 目录 音视频/FFmpeg #Qt Qt-FFmpeg开发-打开本地摄像头录制视频[软 ...

  5. uniapp 输入有值后按钮变色

    我们在开发中难免会遇到一些登录注册输入框中的值为空时,按钮的状态变成为不可点击的状态,当输入框有值后就把按钮变为可点击的状态 代码部分: <input placeholder="请输入 ...

  6. Linux扩展篇-shell编程（九）-shell 异常处理

    1.异常退出 ${0}:获取当前脚本的名称 $?:获取函数返回值或者上一个命令的退出状态 set -x:开启debug调试功能 按照目前个人理解,异常分为以下几种情况: 程序处理的异常退出 程序员判断 ...

  7. ABC330

    D 记录每一行,每一列有多少个 o,然后统计答案即可. code E 想到 \(mex^{i \le n}_{i = 1} a_i \le n\) 这整个题就可做了(赛时因为没想到这个,痛失 \(47 ...

  8. echarts柱状图横(x)轴文字显示不全,一招解决

    柱状图底部X轴文字过长时,将会出现文字显示不全的问题,这是echarts为了美观默认的设置 现在我们把文章倾斜旋转点角度即可全部显示 以下是代码 scale() { var chartDom = do ...

  9. Java 获取当前时间的年、月、日、小时、分钟、秒数

    public static void getDateTime() throws ParseException{ Calendar now = Calendar.getInstance(); Syste ...

  10. http请求方式-HttpURLConnection

    http请求方式-HttpURLConnection import com.alibaba.fastjson.JSON; import com.example.core.mydemo.http.Ord ...