前端切图:一个好看的表格css样式

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<table border="1" id="dataTable" style=" border-collapse:collapse;border-spacing:0; border:1px solid #FFFFFF;" >
<tr style="background:#50aca2;color: #fff;border-bottom-width: 0; text-align: center; height: 2.2rem;">
<td>姓名</td>
<td>联系电话 </td>
<td>邮箱 </td>
</tr>
<tr style="background: #e5efeb; text-align: center;height: 2.2rem;">
<td>王婷</td>
<td>15210441885</td>
<td>1357097537@qq.com</td>
</tr>
<tr style="background: #e5efeb; text-align: center;height: 2.2rem;">
<td>小金龙</td>
<td>13661725475</td>
<td>1357097537@qq.com</td>
</tr>
</table>
</body>
</html>
前端切图:一个好看的表格css样式的更多相关文章
- 前端切图相关ps技术
标签(空格分隔): 前端切图 复制图层到一个新的ps文件 对于单个图层 1.选中图层 2.CTRL+A全选 3.CTRL+C 4.CTRL+N新建文件,文件大小默认就可以(背景透明也在这个面板设置), ...
- 前端切图神器-cutterman
之前我写过一篇关于前端切图的博客:https://www.cnblogs.com/tu-0718/p/9741058.html 但上面的方法在切图量大时依然很费时间,下面向大家推荐这款免费切图神器 c ...
- 前端切图实战(PSD设计稿转化为前端)
课程来源:https://www.imooc.com/learn/668 一:读设计稿 划分:头部.尾部.公共部分.大概分多少块.logo的重用.列表有哪些.各部分用什么技术实现等等. 二:建立项目目 ...
- 表格CSS样式美化
1. 单像素边框CSS表格 这是一个很常用的表格样式. <!-- CSS goes in the document HEAD or added to your external styleshe ...
- 一个可以自动生成css样式的插件happycss
一直在页面写css, 重复写着样式,发现布局中,特别是h5,大量的样式都是margin,padding,width,height, 而,当我们需要给一个标签写样式的时候,避免内联样式,我们又需要取cl ...
- 【JavaScript框架封装】实现一个类似于JQuery的CSS样式框架的封装
// CSS 样式框架 (function (xframe) { // 需要参与链式访问的(必须使用prototype的方式来给对象扩充方法)[只要是需要使用到this获取到的元素集合这个变量的时候, ...
- 构建前端第6篇之---内嵌css样式 <el-button style="width:100%"> 登录 </el-button>
张艳涛写于2021-1-20日 What: 如何让button的长度和input长度一致呢 最先想到的是给这个button加一个class ="buttonclass",然后在vu ...
- 【前端切图】用css画一个卡通形象-小猪佩奇
最近在腾讯云技术社区遇到了一位奇才,用css画出了一个社会人小猪佩奇,不得不服.研究了一下他的文章https://segmentfault.com/a/1190000014909658,感觉甚是有趣, ...
- 前端切图:CSS实现隐藏滚动条同时又可以滚动
CSS 实现隐藏滚动条同时又可以滚动 原始功能: 图片发自简书App 添加伪类之后的功能: 图片发自简书App 完整demo如下: <!DOCTYPE html> <html> ...
随机推荐
- Android RecyclerView And CardView
Google I/O 2014大会公布Android L系统,还有Material Design全新的设计风格.而Material Design卡片式的设计.Google Play应用商店和G+ AP ...
- vue使用jsonp
axios不支持jsonp,所以需使用其他插件:vue-jsonp npm i vue-jsonp -S 然后在 src/main.js : import Vue from 'vue' import ...
- Flask项目之手机端租房网站的实战开发(十)
说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...
- 水题ing
T1: https://www.luogu.org/problemnew/show/P1724幻想乡,东风谷早苗是以高达控闻名的高中生宅巫女.某一天,早苗终于入手了最新款的钢达姆模型.作为最新的钢达姆 ...
- Android 快速下载 Android framework 源码
官网 Android framework源码git地址 github: https://github.com/android/platform_frameworks_base google 官方: h ...
- 学习笔记:TypeScript入门——基础类型
前言: TypeScript官网断断续续看过几遍,不知道项目中如何使用,有机会还是要实践一下.现在再把文档上不懂的知识点理一遍. 基础类型 1.什么是元组Tuple? 元组类型允许表示一个已知元素数量 ...
- JS学习笔记 - fgm练习 2-11- 改变图片路径 var img = new Image(); 图片预加载
<style> *{ margin: 0;padding: 0; list-style: none; } body{ background: black; } .outer{ margin ...
- StackExchange.Redis 官方文档(六) PipelinesMultiplexers
原文:StackExchange.Redis 官方文档(六) PipelinesMultiplexers 流水线和复用 糟糕的时间浪费.现代的计算机以惊人的速度产生大量的数据,而且高速网络通道(通常在 ...
- linux下设置密码复杂度限制,怎么设置?
在linux,设置密码复杂度的方法有几个1. 一个是在/etc/login.defs文件,里面几个选项PASS_MAX_DAYS 90 #密码最长过期天数PASS_MIN_DAYS 80 #密码最小过 ...
- HDU 1018 Big Number 数学题解
Problem Description In many applications very large integers numbers are required. Some of these app ...