文本实现斑马线效果

<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. js基本数据类型+判断数据类型方法

    摘要:不管是什么类型的,Object.prototype.toString.call();都可以判断出其具体的类型,简单基本类型(String.Number.Boolean.Null.Undefine ...

  2. 阿里知识储备之二——junit学习以及android单元测试

    一,junit框架 http://blog.csdn.net/afeilxc/article/details/6218908 详细见这篇博客 juit目前已经可以和maven项目进行集成和测试,而且貌 ...

  3. js的浅拷贝和深拷贝和应用场景

    为什么会用到浅拷贝和深拷贝 首先来看一下如下代码 let a = b = 2 a = 3 console.log(a) console.log(b) let c = d = [1,2,3] let e ...

  4. sql 查询每天数据

    一 表 内数据存的是 ‘2017-09-08 15:13:59’这样格式 表 customer_mate_follow 时间字段 created_at   1, SELECT ,) as day, C ...

  5. Array Stack Implement using C

  6. leetcode-mid-math-172. Factorial Trailing Zeroes-NO-？？？？

    mycode 问题:为甚在小于200的时候,答案ok,大于等于200的时候,就少一个1??? class Solution(object): def trailingZeroes(self, n): ...

  7. leetcode-mid-math-29. Divide Two Integers-NO

    mycode   91.28% class Solution(object): def divide(self, dividend, divisor): """ :typ ...

  8. eclipse经常卡死

    修改eclipse.ini 将启动内存,最小内存,最大内存都增大 eclipse是内存不够再去申请,直到有最大内存的 若上述方法不行则换eclipse    eclipse有的版本是不稳定的,我用Ke ...

  9. 细数EDM营销中存在的两大盲点

    国庆节了,祝大家国庆快乐,转眼博客至今已有三年了.下面博主为大家介绍EDM营销中存在的两大盲点,供大家参考. 一是忽略用户友好.用户友好策略是Email营销成功的关键要素,具体包括内容友好策略.方式友 ...

  10. 怎么用jira写bug

    工具/原料 有网的电脑 方法/步骤1: 打开公司给的访问JIRA的链接,输入公司给你注册的账号和密码,点击登录 方法/步骤2: 点击JIRA主菜单上的“创建”,进入编辑bug界面 方法/步骤3: 项目 ...