我的前端工具集(七)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. 前端学习之路之CSS (一)

    Infi-chu: http://www.cnblogs.com/Infi-chu/ 简介:    CSS 指层叠样式表 (Cascading Style Sheets)    样式定义如何显示 HT ...

  2. Java的Final和C#的Const,Readonly比较分析(转载)

    Java里面没有readonly关键字,预留了const的关键字,目前还没有实际用途,在Java中,跟这两个关键字比较接近的是final; C#中,两者都存在并可用.两者修饰的全局变量或局部变量都不能 ...

  3. 按键精灵Q语言基础

    一.数据类型1.1数据类型可以表示一切的类型variant逻辑类型:boolean (true,false)数学类型: 整数:byte(0-255),integer(-32768-32767),lon ...

  4. Tesseract-OCR-04-使用 jTessBoxEditor 进行训练

    Tesseract-OCR-04-使用 jTessBoxEditor 进行训练 本篇是关于 jTessBoxEditor 进行训练,使 Tesseract-OCR 文字识别准确率得到极大的提高,本篇完 ...

  5. Mybatis学习第一天——Mybatis的安装配置以及基本CURD操作

    1.Mybatis下载 Mybatis是开源的持久层框架,能够度jdbc进行简单的封装,但其并不是完全的ORM(Object Relational Mapping,对象关系映射),无法脱离数据库进行适 ...

  6. 从尾到头打印链表(C++和Python 实现)

    (说明:本博客中的题目.题目详细说明及参考代码均摘自 “何海涛<剑指Offer:名企面试官精讲典型编程题>2012年”) 题目 输入一个链表的头结点, 从尾到头反过来打印出每个结点的值. ...

  7. mongodb数据库备份恢复-windows系统

    备份语法: mongodump命令脚本语法如下: >mongodump -h dbhost -d dbname -o dbdirectory -h: MongDB所在服务器地址,例如:127.0 ...

  8. python requests实现windows身份验证登录

    1.安装ntlm  https://github.com/requests/requests-ntlm pip install requests_ntlm 2.使用 import requests f ...

  9. linux 问题总结

    1.The program 'make' can be found in the following packages: 解决方法:sudo apt-get install build-essenti ...

  10. vsphere的P2V工具做的物理机迁移到虚拟机报错out of memory

     vsphere的P2V工具做的物理机迁移到虚拟机  迁移成功,但是启动报错  进入rescue模式后发现是sysctl.conf文件的参数设大了因为虚拟机的内存没有物理机内存大 kernel.shm ...