话不多说上效果图：

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. css3颜色模式 圆角的实现 width的属性值 触发怪异盒模型

    Css颜色模式: rgb(255,0,0) rgba(255,0,0,0.5)(0.5是透明度) hsl(58%,56%)色彩饱和度 hala() border-image   url(路径) 向内偏 ...

  2. 让Easysearch运行在Kylin V10 (Lance)-aarch64上

    简介 本文主要介绍在国产操作系统 Kylin V10 (Lance)-aarch64 上安装单机版 Easysearch/Console/Agent/Gateway/Loadgen 系统配置 在安装之 ...

  3. 利用Wireshark抓包分析DNS域名解析过程

    一.DNS协议概述   DNS协议也可以称为DNS服务,全称是Domain Name System,即域名系统,和HTTP协议一样,也是一个位于应用层的协议(服务),它是基于运输层的UDP协议的.从D ...

  4. 一个常见的 JavaScript 解构陷阱

    在日常的 JavaScript 编码中,我们经常使用解构语法来提取对象中的属性.假设我们有一个名为 fetchResult 的对象,代表从接口返回的数据,其中包含一个字段名为 data. const ...

  5. Linux Debian安装教程

    Debian 是一个免费的开源操作系统,是最古老的 Linux 发行版之一,于 1993 年由 Ian Murdock 创建.它采用了自由软件协议,并且由志愿者社区维护和支持.Debian 的目标是创 ...

  6. 浅谈 DDD 领域驱动设计

    文章简介 在B端产品研发及项目实施中,DDD带给我们哪些思考?我们是如何应用的?本文不是科普贴,旨在分享我们的经历和思考. 背景 Domain Driven Design(简称 DDD),又称为领域驱 ...

  7. caddy 服务器的 Docker 镜像构建流程

    构建一个包含 Caddy 服务器的 Docker 镜像,关键部分: https://github.com/caddyserver/caddy-docker/blob/master/Dockerfile ...

  8. RequestBodyAdvice和注解方式进行统一参数处理demo

    RequestBodyAdvice和注解方式进行统一参数处理demo @Target({ ElementType.METHOD, ElementType.TYPE }) @Retention(Rete ...

  9. Interceptor拦截器demo

    Interceptor拦截器demo ##接口测试类 @RestController public class TestController { @RequestMapping(value = &qu ...

  10. 01-Linux系统介绍、安装与入门

    关于Linux 背景 最先出现的是Unix操作系统,这种操作系统收费,而且适用于大型机上面. Linus想做一个免费的,传播自由的操作系统.他就仿照Unix的操作,做了一个类Unix系统:Linux内 ...