关于table的td和ul元素li隔行变色的功能实现
table元素的td和ul元素li隔行变色的功能实现
利用css控制二者的样式轻松实现隔行换色:
例如:table的css样式控制:
table tr td{
background-color:颜色1
}
table tr td:nth-child(2n+1){
background-color:颜色2
}
ul的li样式控制
ul li{
background-color:颜色1;
}
ul li:nth-child(2n+1){
background-color:颜色2;
}
关于table的td和ul元素li隔行变色的功能实现的更多相关文章
- 【丛林】HTML Table 表格浅谈(边框、隔行变色
此例子已经包含本文大部分内容,请对照参考.查看代码 > 定义和用法 table标签定义 HTML 表格. 创建表格的四要素:table.tr.th.td <table> 整个表格以& ...
- JavaScript实现li隔行变色
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- html中测试div、ul和li、table排列多个块
前面有三篇博文测试了这三种方式,一.相关博文:LODOP问答部分链接.该文用的是div定位,用的是所有小div相对于大div进行定位,大的div设置relative定位,小的设置absolute相对于 ...
- 如何使ul中li元素横向排列且不换行
外层div容器宽度固定,ul宽度随li(li宽度固定)的增加而撑开,但是当ul中li的宽度之和大于div时,ul没有撑开,而是li换行了,如何使li不换行? 解决方法:主要是外面容器设置为white- ...
- div、ul、li等无法居中问题,text-align无效 margin auto无效
很简单.如果是div,直接把div换成: <table align="center"> <tr> <td> ...
- DIV+CSS中标签ul ol li dl dt dd用法
ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...
- html中table,tr,td
table表格,tr表格中的行,tr表格中的列,等级关系是table>tr>td, 当然表格中还包括thead,tbody,tfoot,th,但由于浏览器支持缘故很少使用.另外table在 ...
- ul、li模仿ios的TableView实现城市选择
最近项目一个接着一个,之前说的精创环的项目还没做完,今天说先把那个放一下,先做访客系统,销售会见客户之后可以对客户进行一个跟踪记录,原型图也给了,今日头条的频道自定义页面一样. 如果是在IOS上让我来 ...
- ul、li实现横向导航按钮
好久没写博客了,主要是懒得呼气都不想呼,上周分给我一个新的任务,就是自己新建一个系统,快速极限开发,虽然之前自己也做过小的系统,但毕竟是自己做,随着自己的心意做,没有做其他的限制等,现在呢是给公司做, ...
随机推荐
- 基于【CentOS-7+ Ambari 2.7.0 + HDP 3.0】搭建HAWQ数据仓库01 —— 准备环境,搭建本地仓库,安装ambari
一.集群软硬件环境准备: 操作系统: centos 7 x86_64.1804 Ambari版本:2.7.0 HDP版本:3.0.0 HAWQ版本:2.3.05台PC作为工作站: ep-bd01 e ...
- js 零散知识总结
网页播放声音 这个非常简单,我们只需要在html和js设置即可.首先看html代码 html代码 <audio id="sound" autoplay="autop ...
- N76E003的环境搭建
一.准备工作: 1.下载编译工具keil c51 2.下载N76E003提供的板级支持包(BSP),可到nuvoton上下载 二.开发环境搭建 1.安装keil c51,然后和谐...不能随便发链 ...
- 五、Sql Server 基础培训《进度5-数据类型(知识点+实际操作)》
知识点: ================================================= ============================================= ...
- fastadmin 使用记录
1.引用静态css文件 参考路径:D:\wwwroot\public\assets\addons\cms\css 静态资源文件基本都放在public目录下引用 引用实例 D:\wwwroot\addo ...
- Ubuntu下安装LNMP
1.安装mysql sudo apt-get install mysql-server mysql-client 2.安装nginx sudo apt-get install nginx 安装完后重启 ...
- 28、gulp
一.gulp的作用? 1.gulp-sass : 编译sass 2.gulp-rename : 重命名 3.gulp-cssnano : 压缩css 4.gulp-concat : 合并文件 5.gu ...
- STL之pair对组
#include<iostream> #include<algorithm> #include<cstring> #include<cstdlib> u ...
- C++多态等知识点
分清虚函数和纯虚函数的区别:(1).虚函数是函数前加关键字virtual,一般定义格式为:virtual 类型 函数名 (参数表){ 函数体 } (2).纯虚函数的生命格式为: virtual 类型 ...
- vue的数据双向绑定和ref获取dom节点
vue是一个MVVM的框架 业务逻辑代码即js部分是model部分, html是view部分. 当model改变的时候,view也会改变 view 改变是,model也会改变 <template ...