我的前端工具集(七)div背景网格

 

liuyuhang原创,未经允许禁止转载

目录

我的前端工具集

有时候总觉得div颜色过于白,于是给了10%的灰

但是并不一定能解决问题,因为页面中会有不均衡的空白处,导致大面积灰有些暗淡

于是想给div背景加上网格

1.css代码

.gridbackground { /*网格背景*/
/*90度直线,100灰度,0.1透明度,5%宽度,0透明度背景*/
background: linear-gradient(90deg, rgba(100, 100, 100, 0.1) 5%, transparent 0),
/*0度直线,100灰度,0.1透明度,5%宽度,0透明度背景*/
linear-gradient(rgba(100, 100, 100, 0.1) 5%, transparent 0);
/*横纵向宽距*/
background-size: 20px 20px;
}

2.指定div中的class

     <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 stripe" id="assetShowTree">
<h4>资产列表加载中...</h4>
</div>

3.效果

以上!

我的前端工具集(七)div背景网格的更多相关文章

  1. 我的前端工具集(六)Ajax封装token

    我的前端工具集(六)Ajax封装token   liuyuhang原创,未经允许禁止转载 在单点登陆中,或登陆验证后,不应该每次都验证用户名和密码, 也不应该将用户名密码存入cookie中(虽然很多都 ...

  2. 我的前端工具集(八)获得html元素在页面中的位置

    我的前端工具集(八)获得html元素在页面中的位置   liuyuhang原创,未经允许禁止转载 目录 我的前端工具集 有时候需要用点击等操作,来获取某元素在页面中的位置,然后在该位置添加某些操作 如 ...

  3. 都2022年了,你的前端工具集应该有vueuse

    摘要:一款基于Vue组合式API的函数工具集. 本文分享自华为云社区<vueuse:我不许身为vuer的前端,你的工具集只有lodash!>,作者: 前端要摸鱼 . vueuse 是什么? ...

  4. 前端工具之WebPack解密之背景

    请注意,这是一篇站在完全新手的角度上来写的文章.可能你是一个后端人员想了解前端工具的使用和概念;也可能你是一个前端小菜(还在DIV+CSS的世界里挣扎着).本文比较适合那些以前完全没有接触过WebPa ...

  5. 前端工具 - 15个最佳的 JavaScript 表单验证库

    客户端验证在任何项目都是不够的,因为 JavaScript 可以直接忽略,人们可以提交请求到服务器. 然而这并不意味着客户端验证都没必要了,很多时候我们需要在用户提交到服务器之前给予提示.JavaSc ...

  6. Visual Studio 2015和ASP.NET 5中可用的前端开发工具集

    最近微软发布了一本白皮书,谈到了一些可以和Visual Studio 2015和ASP.NET 5配合使用的JS/前端Web开发工具(比如:函数库.任务执行器.框架等). 由于现在前端开发的生态系统在 ...

  7. 前端好的工具集推荐 lodash

    原来用 backbone 的时候, 感觉 underscore 是一个好的工具集,顿时感觉不错,不用自己一直去封装一些组件. 直到我遇到了 lodash,一只发现 web 项目中有依赖这个库的,但是一 ...

  8. 前端工具之WebPack解密--使用

    接上一篇的内容继续来说,背景篇的内容主要是介绍web前端工具的出现的原因和当前主要JavaScript模块化编程的几种规范!这篇内容主要介绍webpack的初级使用! 注意:目前webpack分为两个 ...

  9. css3前端工具

    随着CSS3的出现,CSS3讨论的话题越来越多了,现在各种教程也是多如牛毛,不比一年前的时候,找个资料要捞遍整个互联网,而且还很难找到自己需要的参考资料.从侧面也说明,CSS3对于前端工程师来说,越来 ...

随机推荐

  1. Session、Cookie详解(2)

    session是web开发里一个重要的概念,在大多数web应用里session都是被当做现成的东西,拿来就直接用,但是一些复杂的web应用里能拿来用的session已经满足不了实际的需求,当碰到这样的 ...

  2. AD诊断命令

    dcdiag repadmin /showrepl "启动从dc02到dc01的复制"cmd /c "repadmin /replicate dc02 dc01 dc=u ...

  3. ESXi中的虚拟机如何使用U盘和加密Key

    最近想在虚拟机中的主机使用通讯加密key来部署专门用于转发和加密的通讯前置机.故查询测试一下是不是能识别. 第一步:在虚拟宿主机上添加USB控制器,右键单击目标虚拟机,选中"编辑设置&quo ...

  4. python 面向对象:类,作用域

    类(Class)和实例(Instance) 定义类是通过class关键字:class Student(object): pass class后面紧接着是类名,即Student接着是(object),表 ...

  5. 第二周 day2 python学习笔记

    1. python中的三元运算: result=value1 if 条件 else value2 如果条件成立,result=value1 如果条件不成立,result=value2 2. pytho ...

  6. 记一次insert因为db file sequential read影响性能导致性能原因的分析

    通过详细的10046 trace发现,大量的io等待分布在以下数据文件上:Misses in library cache during parse: 0Elapsed times include wa ...

  7. 如何控制table中td内的文本位置

    默认为左中效果    td中垂直用valign 取值为:top/middle/bottom/baseline,水平用align 取值为:left,center,right;

  8. jQuery解决高度统一问题

    <div class="itemdl over"> <dl class="fl"> <dt><img src=&quo ...

  9. 040同步条件event

    条件同步和条件变量同步差不多意思,只是少了锁功能,因为条件同步设计于不访问共享资源的条件环境,event=threading.Event():条件环境对象,初始值为False.event.isSet( ...

  10. 初识java——Java程序的历史、开发和运行

    上了一节Java试听课,整理出如下笔记.     Java最新版本下载 http://www.oracle.com/technetwork/java/javase/downloads/index.ht ...