文本实现斑马线效果

<style>

　　p {

	font-size: 17px;

	line-height: 25px;

	background-color: antiquewhite;

	background-image: linear-gradient(#99999 50%, transparent 0);

	background-size: auto 50px;

	background-origin: content-box;

      }

</style>

<body>

　　<p>咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕咕</p>

</body>

　　表格实现斑马线效果

<style>

　　tr{

	background: #ffffff;

	width: 1.25rem;

	height: 1.875rem;

　　　　}

　　tr:nth-child(2n) {

　　　　background: #E9E9E9;

　　　　}

</style>

<body>

　　<table>

　　　　<tr>

　　　　　　<td>1</td><td>2</td><td>3</td><td>4</td>

　　　　</tr>

　　　　<tr>

　　　　　　<td>1</td><td>2</td><td>3</td><td>4</td>

　　　　</tr>

　　　　<tr>

　　　　　　<td>1</td><td>2</td><td>3</td><td>4</td>

　　　　</tr>

　　</table>
</body>

　　

css实现斑马线效果的更多相关文章

  1. css三级菜单效果

    一个简单实用的css三级菜单效果 <!doctype html> <html> <head> <meta charset="utf-8"& ...

  2. 利用target的特性，可以实现纯css的tab效果切换

    基础知识: :target起作用的是href连接到的位置 如 <a href="#tab1">tab1</a> <div id="tab1& ...

  3. 推荐20款基于 jQuery & CSS 的文本效果插件

    jQuery 和 CSS 可以说是设计和开发行业的一次革命.这一切如此简单,快捷的一站式服务.jQuery 允许你在你的网页中添加一些真正令人惊叹的东西而不用付出很大的努力,要感谢那些优秀的 jQue ...

  4. CSS 边框 阴影 效果

    CSS 边框 阴影 效果 以下将css实现阴影效果,以便须要朋友们,直接上代码 #shadow1{ width: 200px; height: 100px; color: white; backgro ...

  5. Css实现透明效果，兼容IE8

    Css实现透明效果,兼容IE8 >>>>>>>>>>>>>>>>>>>>> ...

  6. HTML与CSS简单页面效果实例

    本篇博客实现一个HTML与CSS简单页面效果实例 index.html <!DOCTYPE html> <html> <head> <meta charset ...

  7. css 实现评分效果

    css实现评分效果,其实是css sprites (css精灵)的延伸应用,效果的实现主要是由  background-position 属性移动图片位置.之前看到有前辈写过关于这方面的内容,在理解上 ...

  8. 纯 CSS 实现波浪效果！

    一直以来,使用纯 CSS 实现波浪效果都是十分困难的. 因为实现波浪的曲线需要借助贝塞尔曲线. 而使用纯 CSS 的方式,实现贝塞尔曲线,额,暂时是没有很好的方法. 当然,借助其他力量(SVG.CAN ...

  9. React 系列教程 1：实现 Animate.css 官网效果

    前言 这是 React 系列教程的第一篇,我们将用 React 实现 Animate.css 官网的效果.对于 Animate.css 官网效果是一个非常简单的例子,原代码使用 jQuery 编写,就 ...

随机推荐

  1. [BZOJ5463][APIO2018]铁人两项：Tarjan+圆方树

    分析 根据题目中的要求,从\(s\)出发前往\(f\)一定可以,并且只可能经过这两个结点所在的点双连通分量和它们之间的点双连通分量,因此切换点\(c\)只能从这些点中选取. 建出圆方树后,因为圆方树上 ...

  2. 关于spring data jpa的@query的传入参数是对象怎么匹配参数

    /** * Specifies methods used to obtain and modify person related information * which is stored in th ...

  3. mysql数据库表反向生成modes类

    一,如果你是windows,打开cmd,切换到desktop目录下 二,需要连接你的数据库,并且执行命令:sqlacodegen  --outfile models.py mysql+pymysql: ...

  4. 关于option标签的selected属性

    当item的dict_id和custSource一样,那么当前的item的name就被选中并显示在页面 如果直接写selected="selected",就等于直接回显这个集合中最 ...

  5. 每日踩坑 2019-08-23 button 元素点击后刷新页面

    button标签按钮会提交表单. 解决方案: <button class="btn btn-primary" type="button" id=" ...

  6. 后盾网lavarel视频项目---lavarel中间件（使用中间件拦截没登录的用户）

    后盾网lavarel视频项目---lavarel中间件(使用中间件拦截没登录的用户) 一.总结 一句话总结: 1.中间件中验证用户是否登录:if(!Auth::guard('admin')->c ...

  7. nodejs 文件操作

    前言: nodejs 自带的文件操作的模块  fs 就是对文件的增删查改: 就像我们用的服务器,我们没有办法在运行的文件上进行一直的修改,因为他不向浏览器,刷新后我们的文件会自己修改: 如果想要更改我 ...

  8. 屏蔽ffmpeg命令的所有提示

    有时候需要隐蔽的执行ffmpeg不希望输出任何日志,提示.这个时候只需要多添加这个参数即可 -loglevel quiet

  9. 二进制方式安装mysql

    下载官方打包好的rpm的集合 https://downloads.mysql.com/archives/get/file/mysql-5.7.20-1.el7.x86_64.rpm-bundle.ta ...

  10. sklearn—无监督最近邻

    无监督最近邻 NearestNeighbors (最近邻)实现了 unsupervised nearest neighbors learning(无监督的最近邻学习). 它为三种不同的最近邻算法提供统 ...