1.text-align与vertical-align:

text-align控制水平方向的定位,关键字是left、right、center和justify。

vertical-align控制垂直方向的定位,关键字是top、baseline、middle或bottom。

两者的区别是,vertical-align不会被继承,因此只能直接用到<th>和<td>标签上。

2.控制表格单元之间的空格:CSS提供了border-spacing属性来控制这条间隙。将该属性应用到表格本身,并且如果希望删除浏览器通常会在单元格之间显示的那部分空格,则可以将border-spacing的值设置为0:

table{
border-spacing:0;
}

3.消除双边框:一个单元格的底部边框与下一个单元格的顶部边框叠加在一起,产生了一条比border值粗两倍的直线。消除双边框的最好办法是利用border-collapse属性。它接受两个值:separate和collapse。collapse选项则消除了单元间隔和双边框。

注意:如果将border-collapse属性值设置为collapse,border-spacing就将不起作用。

4.圆角:border-radius属性可以给表格添加圆角。

注意:如果将border-collapse属性设置为collapse,border-radius将不起作用。

5.给行和列定义样式:

通过nth-of-type选择器可以给奇数行和偶数行添加不同的颜色样式:

tr:nth-of-type(odd){background-color:red;}
tr:nth-of-type(even){background-color:blue;}

6.HTML提供了<colgroup>标签和<col>标签,分别表示一组组列和个别的列。表格中的每一行都包含一个<col>标签。

7.隐藏空白的单元格:在表格样式中添加:empty-cells:hide可以隐藏空白的单元格。但是使用了border-collapse属性值为collapse,浏览器将会忽略empty-cells属性。

8.html的表单元素

fieldset

<fieldset>标签用来集中相关的表单问题

legend

<legend>标签就在<fieldset>标签的html代码之后,它给一组域提供一个标签。

text fields

<input type=”text”>、<textarea>标签都是在表单中创建文本框。这些标签允许在你的浏览器上进行统一的控制。

buttons

表单按钮,让访问者提交表单、重填内容,或者触发一些其他的动作。

drop-down menus

对于<select>标签创建的下拉菜单,也可以在一定程度上定义样式。

checkbox和radio button

大部分浏览器都不允许对这些元素设定格式,但是Opera浏览器可以在复选框或按钮里面设定背景。

CSS3秘笈复习:第十一章的更多相关文章

  1. CSS3秘笈复习:十三章&十四章&十五章&十六章&十七章

    第十三章 1.在使用浮动时,源代码的顺序非常重要.浮动元素的HTML必须处在要包围它的元素的HTML之前. 2.清楚浮动: (1).在外围div的底部添加一个清除元素:clear属性可以防止元素包围浮 ...

  2. CSS3秘笈复习:第九章&第十章

    第九章 1.和链接有关的伪类: (1):link,未访问过的链接 (2):visited,已访问过的链接 (3):hover,鼠标悬停链接 (4):active,单击链接时 这四种方式一定要严格按上面 ...

  3. CSS3秘笈复习:第一章&第二章&第三章

    第一章: 1.<cite>标签不仅可以将网页设置为斜体,还能给标题做上标记,使它便于被搜索引擎搜索到. 第二章: 1.import指令链接样式表: CSS本身有一种添加外部样式的方法:@i ...

  4. CSS3秘笈:第十一章

    表格和表单的格式化 1.表格的各种标签提供了许多有用的“钩子”,可以再上面挂CSS样式.如果创建了<th>标签样式,那么每一个列的标题——<th>标签——看起来就有可能与其他的 ...

  5. CSS3秘笈复习:第六章

    第六章 1.文本大写化: text-transform:uppercase; 另外三种选项是:lowercase或capitalize以及none. 2.文本修饰: text-decoration:u ...

  6. CSS3秘笈复习:第七章

    1.边距冲突: 当元素的bottom margin碰到另一个元素的top margin可能会产生一些怪异的计算,浏览器会忽略小的那个值而使用大的值. 2.边距折叠: 假设要在警告框里插入一个标题,并且 ...

  7. CSS3秘笈:第七章

    第七章  margin.padding和border 1.盒模型:四个属性: (1)padding:内容与其边框线之间的空间. (2)border:盒子周围的直线 (3)background-colo ...

  8. CSS3秘笈:第六章

    第六章  文本格式化 1.font-family 属性设置字体.除了指定想要的字体之外还要使用备用字体.例如: p{ font-family:Arial ,Helvetica ,sans-serif; ...

  9. CSS3秘笈:第五章

    第五章  层叠管理样式 1.层叠是决定哪些样式属性要被应用到某一个元素的一套规则. 2.最近的祖先样式胜出:浏览器会采用离相关标签最近的样式. 3.直接应用的样式胜出:任何直接应用于指定标签的样式都战 ...

随机推荐

  1. [SQL基础教程] 4-3 数据的更新(UPDATE)

    [SQL基础教程] C4 数据更新 4-3 数据的更新(UPDATE) UPDATE UPDATE <表名> SET <列名> = <表达式>; UPDATE &l ...

  2. JavaEE XML DOM创建之DOM4J

    DOM4J创建xml文档 @author ixenos 1 写出内容到xml文档 XMLWriter writer = new XMLWriter(OutputStream, OutputForamt ...

  3. JavaEE XML DOM解析之DOM4J

    DOM解析之DOM4J @author ixenos DOM4J常用API 读取xml文档: Document doc = new SAXReader().read("xml文件" ...

  4. 关于64位win7环境下VS连接oracle数据库的问题

    本机环境:64位win7,安装了64位的oracle桌面类 服务器环境:64位windows server 2008,64位oracle服务器端 问题:本机用sql developer连数据库没有问题 ...

  5. netty高级篇(3)-HTTP协议开发

    一.HTTP协议简介 应用层协议http,发展至今已经是http2.0了,拥有以下特点: (1) CS模式的协议 (2) 简单 - 只需要服务URL,携带必要的请求参数或者消息体 (3) 灵活 - 任 ...

  6. php的redis函数

    phpredis中文手册--<redis中文手册> php版   redis中文手册:http://readthedocs.org/docs/redis/en/latest/ 本文是参考& ...

  7. android 控件注意点

    控件一:listview 问题一:当listview的item中存在按钮这种控件时 item点击不能响应问题? 解决方案:在item的自定义控件的最外层空间 上添加属性 android:descend ...

  8. macos上安装wget命令

    首先从Apple Store下载Xcode,然后安装Xcode,接着安装Homebrew包管理,类似于Ubuntu下的apt-get: 终端下输入ruby -e "$(curl -fsSL ...

  9. 使用 voluptuous 校验数据

    在 Python 中,我们经常需要对参数进行校验,这是我们有好多种方法,例如写很多 if 啊,或者写正则表达式啊等等,技巧高的人可以写得很巧妙,而技巧一般的人呢,可能会写得很冗长,例如我,经常就不能很 ...

  10. eclipse安装插件的4种方式

    Eclipse插件的安装方法大体有以下三种:[9] 第一种:直接复制法 假设Eclipse的安装目录在C:\eclipse,解压下载的eclipse 插件或者安装eclipse 插件到指定目录AA(如 ...