Table 表单样式
<style>
table th
{
white-space: nowrap;
background-color: #f5f5f5;
height:30px;
font-size:14px;
font-weight:lighter; /*细*/
text-align:right ! important
}
.chk
{
white-space: nowrap;
text-overflow:ellipsis;/*省略*/
}
table td
{
/*word-break:keep-all;*/
white-space:nowrap; /*不换行*/
text-overflow:ellipsis;
}
</style>
<table border="1" bordercolor="#a0c6e5" style="border-collapse: collapse; width: auto">
<tr>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;" >
<input type="text" value="" placeholder="Valid Email Address" />
<input type="button" value="submit"/>
</td>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" placeholder="Valid Email Address" />
</td>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" placeholder="Valid Email Address" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" placeholder="Valid Email Address" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" placeholder="Valid Email Address" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;" class="chk">
<input type="checkbox" />
男
<input type="checkbox" />
女
</td>
</tr>
<tr>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;" class="chk">
<input type="checkbox" />
男
<input type="checkbox" />
女
</td>
</tr>
<tr>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;">
<input type="text" value="" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;" colspan="3">
<input type="text" value="" style="width: 99%" />
</td>
<th>
测试:测试:测试:
</th>
<td style="border: solid 1px #a0c6e5; height: 20px;" class="chk">
<input type="checkbox" />
男
<input type="checkbox" />
女
<input type="checkbox" />
女
</td>
</tr>
</table>
Table 表单样式的更多相关文章
- 还不错的Table样式和form表单样式
作为一个后台开发人员而言,拥有一套属于自己的前台样式是比较重要的,这里分享一下自己感觉还不错的样式,以后遇到好的,还会陆续添加 上图: 带鼠标滑动效果的table样式看起来比较清爽 样式 <he ...
- HTML表单样式
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...
- BootStrap入门教程 (二) :BASE CSS(排版(Typography),表格(Table),表单(Forms),按钮(Buttons))
上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...
- html5 表单样式 表单验证1 2 3
html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- div仿checkbox表单样式美化及功能
div仿checkbox表单样式美化及功能(checkbox的样式不好看)素材在底部: 效果图: window.css .bj { position: absolute; top: 0; left: ...
- No.14 selenium for python table表单
table表单,HTML中的特征 标识性标签:table.tr.th.td 定位使用Xpath定位 点击表格中的元素即可
- table表单制作个人简历
应用table表单,编程个人简历表单,同时运用了跨行rowspan和跨列colspan. <!DOCTYPE html> <html> <head> <met ...
- 01 UIPath抓取网页数据并导出Excel(非Table表单)
上次转载了一篇<UIPath抓取网页数据并导出Excel>的文章,因为那个导出的是table标签中的数据,所以相对比较简单.现实的网页中,有许多不是通过table标签展示的,那又该如何处理 ...
- CSS_简介/语法结构/长度单位/应用方式/标签的样式重置/表单样式重置
一.CSS简介: w3c(World Wide Web Consortium):万维网联盟,是规定网页标准的一个组织(叫做Web标准) Web标准:是由w3c和其他标准化组织制定的一系列标准的集合, ...
随机推荐
- Normalize.css的使用及下载
Normalize.css 只是一个很小的CSS文件,但它在默认的HTML元素样式上提供了跨浏览器的高度一致性.相比于传统的CSS reset,Normalize.css是一种现代的.为HTML5准备 ...
- ButterKnife Zelezny从配置到使用
插件介绍:ButterKnife是一个专注于Android系统的View注入框架,可以减少大量的findViewById以及setOnClickListener代码,可视化一键生成.又一神器,完美告别 ...
- ListView之性能优化
listview加载的核心是其adapter,本文通过减少adapter中创建.处理view的次数来提高listview加载的性能,总共分四个层次: 0.最原始的加载 1.利用convertView ...
- c#批量插入数据库Demo
using System; using System.Collections.Generic; using System.Configuration; using System.Data; using ...
- Sybase_游标
本章将介绍如何在Sybase下使用游标 因业务需要,要批量处理一些数据,sql需要用到循环,所以要使用游标,我写了一个简单的游标,sql如下 DECLARE my_Cursor CURSOR FOR ...
- C#语言基础——集合(ArrayList集合)
集合及特殊集合 集合的基本信息: System.Collections 命名空间包含接口和类,这些接口和类定义各种对象(如列表.队列.位数组.哈希表和字典)的集合.System.Collections ...
- C#/ASP.NET定时任务执行管理器组件–FluentScheduler定时器
必须JobManager初始化 方式1: public void Start() { JobManager.AddJob(() => FetchingDa ...
- IE10 IE11 中 网站无法登录问题cookie
方法一: 在程序文件中添加此文件 在项目中创建一个文件夹将下载的文件直接拖入文件夹中 来源于:http://www.hanselman.com/blog/BugAndFixASPNETFailsToD ...
- [LeetCode] Remove Nth Node From End of List 移除链表倒数第N个节点
Given a linked list, remove the nth node from the end of list and return its head. For example, Give ...
- WIN10下安装HBASE教程
工作需要,现在开始做大数据开发了,通过下面的配置步骤,你可以在win10系统中,部署出一套hadoop+hbase,便于单机测试调试开发. 准备资料: 1. hadoop-2.7.2: https:/ ...