文本实现斑马线效果

<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. Oracle删除表空间报ORA01548

    由于undo表空间设置了自动增长,导致替换了好几个undo表空间,就想把原先的undo表空间删掉腾出空间 但删的时候报错 SQL> drop tablespace undotbs1 includ ...

  2. 如何下载如腾讯课堂等PC网页视频的方法

    其实网上的教程有很多,实际也没那么复杂. 一.用插件法 方法是用插件,大多数主流的浏览器都是支持插件的,只要下载个插件应用市场的视频插件就可以搞定了. 当然,每个浏览器的视频插件品牌都是不一样的.这里 ...

  3. wannafly 挑战赛9 E 组一组 （差分约束）

    链接:https://www.nowcoder.com/acm/contest/71/E 时间限制:C/C++ 3秒,其他语言6秒 空间限制:C/C++ 65536K,其他语言131072K Spec ...

  4. [IOI2008/BZOJ1791 岛屿]（处理基环树的小技巧&基于bfs树形DP）

    IOI2008/BZOJ1791 岛屿 题目大意是在一个基环树森林里求每一棵基环树的直径①的和. 其实就是树的直径的基环树升级版.我们先把环找出来,然后从环上的每一个节点x出发,并且不经过环上其他节点 ...

  5. UIImage非正方形图片如何剪切为正方形

    有时候项目里做头像上传时候,必须要把用户从相册或是相机里的选择的图片剪切为指定大小的图片,遇到太大,太小或是太长的图片就需coregraphic来对图片进行剪切 废话不多说,直接上代码 /** * 剪 ...

  6. 模板引擎ejs的include方法

    html无法include header.ejs footer.ejs 最后用 user.ejs在首尾include

  7. Oracle JET mobile cordove navigator.app对象

    在使用 Oracle JET 开发 webapp 时,会使用到 ojrouter ,ojrouter 默认含有历史记录推送功能.在调试 Android 时会发现返回键总是返回到上一次浏览记录(App ...

  8. sass scss less 的编译工具 koala

    使用 koala 时注意事项: 1.目录中一定不能出现中文,否则就会报错 2.文件中如果出现中文(!注释也算) 开头一定要加   @charset "utf-8"; 否则就会出现无 ...

  9. maven 安装jar包命令

    以 spring-context-support-3.1.0.RELEASE.jar 为例,在 @3图中已经给出这个 jar 包的 groupId,artifactId,version信息,手动安装的 ...

  10. python读取文件时遇到非法字符的处理 UnicodeDecodeError: 'gbk' codec can't decode bytes in position

    报错UnicodeDecodeError: 'gbk' codec can't decode bytes in position ipath = 'D:/学习/语料库/SogouC.mini/Samp ...