一，效果图。

二，代码。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>CSS Table表格</title>

    <style>

    table {

        border-collapse: collapse;

        width: 100%;

    }

    table,

    th,

    td {

        border: 1px solid green;

    }

    th {

        height: 50px;

        background-color: green;

        color: white;

    }

    td {

        text-align: right;

        height: 50px;

        vertical-align: bottom;

        padding: 15px;

    }

    </style>

</head>

<body>

    <table>

        <tr>

            <th>Firstname</th>

            <th>Lastname</th>

        </tr>

        <tr>

            <td>Peter</td>

            <td>Griffin</td>

        </tr>

        <tr>

            <td>Lois</td>

            <td>Griffin</td>

        </tr>

    </table>

</body>

</html>

参考资料:《菜鸟教程》

【代码笔记】Web-CSS-CSS Table(表格）的更多相关文章

  1. 初探css -11 Table表格

    CSS 表格 使用 CSS 可以使 HTML 表格更美观. Company Contact Country Alfreds Futterkiste Maria Anders Germany Bergl ...

  2. 纯css实现table表格固定列和表头,中间横向滚动的思路-附案例

    最近做的后台管理系统要处理大量的表格 原项目是采用的for循环加拼接字符串的方式实现;导致js代码一大堆;各种单引号和双引号的嵌套;让人头疼;遂引入vue.js;用v-for做模板渲染;工作量顿时减轻 ...

  3. css设置table表格tr分离

    table { border-collapse:separate; border-spacing:10px 50px; }

  4. CSS 设置TABLE 表格 边框

    /*table列表 合并边框设置*/ .tablelist { border-collapse:collapse; } /*table列表 设置边框宽度及颜色*/ .tablelist td { bo ...

  5. 【代码笔记】iOS-自动成表格的效果

    一,效果图. 二,工程图. 三,代码. RootViewController.h #import <UIKit/UIKit.h> #import "LabelOnBackImag ...

  6. [转]CSS如何设置html table表格边框样式

    原文地址:http://www.divcss5.com/wenji/w503.shtml 对table设置css样式边框,分为几种情况: 1.只对table设置边框 2.对td设置边框 3.对tabl ...

  7. Python学习笔记整理总结【web基础】【web/HTML/CSS/JavaScript/DOM/jQuery】

    一.HTML HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记).相当于定义统一的一套规则,大家都来遵守他,这样就可以 ...

  8. 利用CSS生成精美细线Table表格

    精美的表格是前端开发用到的一个组件,很多时候我们利用复杂的页面style代码,来生成这样的表格,造成了页面的修改性和可读性都非常差.这里推荐直接使用css来产生一个细线表格. 使用方法也很简单: 第一 ...

  9. java：HTML（table表格，ul列表）和CSS（导入.css文件，三种定义颜色方式，三种样式选择器，a标签属性顺序，）

    1.重点掌握: html: 1.form表单:input,checkbox,seelct,radio,button,submit 2.table表格:thead-->tr-->th;tbo ...

随机推荐

  1. 分布式、服务化的ERP系统架构设计

    ERP之痛 曾几何时,我混迹于电商.珠宝行业4年多,为这两个行业开发过两套大型业务系统(ERP).作为一个ERP系统,系统主要功能模块无非是订单管理.商品管理.生产采购.仓库管理.物流管理.财务管理等 ...

  2. Python爬虫实践 -- 记录我的第一只爬虫

    一.环境配置 1. 下载安装 python3 .(或者安装 Anaconda) 2. 安装requests和lxml 进入到 pip 目录,CMD --> C:\Python\Scripts,输 ...

  3. php免杀教程【绝对原创】

    .函数回调. 使用其他函数进行调用,并执行. 如:array_map('a'.'s'.'se'.'r'.'t',array($_POST['x'])); 详细教程 + 测试结果(安全狗+360主机卫士 ...

  4. SUSE12Sp3-.NET Core 2.2.1 runtime安装

    1.安装libicu依赖 1.在线安装 sudo mkdir /usr/local/dotnet #创建目录 cd /usr/local/dotnet sudo wget https://downlo ...

  5. [Swift]LeetCode121. 买卖股票的最佳时机 I | Best Time to Buy and Sell Stock

    Say you have an array for which the ith element is the price of a given stock on day i. If you were ...

  6. python编译、运行、反编译pyc文件

    为了加密 .py 文件,以前一般使用打包成 exe ,但是最近发现可以将其编译成二进制文件 pyc ,虽然反编译难度不大,但是也需要一些水平 编译生成 pyc: 单个文件 代码: import py_ ...

  7. Python内置函数(57)——setattr

    英文文档: setattr(object, name, value) This is the counterpart of getattr(). The arguments are an object ...

  8. BBS论坛（十七）

    17.首页导航条实现和代码抽离 (1)temlates/common/_head.html <meta name="csrf-token" content="{{ ...

  9. JVM基础系列第4讲：从源代码到机器码，发生了什么？

    在上篇文章我们聊到,无论什么语言写的代码,其到最后都是通过机器码运行的,无一例外.那么对于 Java 语言来说,其从源代码到机器码,这中间到底发生了什么呢?这就是今天我们要聊的. 如下图所示,编译器可 ...

  10. 在ASP.NET Core中获取客户端IP地址

    随着ASP.NET的发展,有不同的方式从请求中访问客户端IP地址.WebForms和MVC Web应用程序只是访问当前HTTP上下文的请求. var ip = HttpContext.Current. ...