zoukankan      html  css  js  c++  java
  • HTML 基础3

    表格

    示例1:

    <h4>水平表头+普通边框</h4>
    <table border="1">
    	<caption>caption标签展示表格的标题</caption>
    	<tr>
    		<th>分组</th>
    		<th>姓名</th>
    		<th>性别</th>
    		<th>联系电话</th>
    	</tr>
    	<tr><td rowspan="3">D3</td><td>Daniel</td><td>male</td><td>123</td></tr>
    	<tr><td>Aliex</td><td>female</td><td>333</td></tr>
    	<tr><td>Rachel</td><td>female</td><td>123</td></tr>
    	<tr><td>D4</td><td>John</td><td>male</td><td>&nbsp</td></tr>
    </table>
    <hr/>

     效果:

    示例2:

    <h4>垂直表头+普通边框</h4>
    <table border="1">
    	<caption>第二个表格</caption>
    	<tr>
    		<th style="background-color:red">分组</th><td colspan="3">D3</td><td>D4</td>
    	</tr>
    	<tr>
    		<th>姓名</th><td>Daniel</td><td>Aliex</td><td>Rachel</td><td>John</td>
    	</tr>
    	<tr>
    		<th>性别</th><td>male</td><td>female</td><td>female</td><td>male</td>
    	</tr>
    	<tr>
    		<th>联系电话</th><td>123</td><td>333</td><td>123</td><td>&nbsp</td>
    	</tr>
    	<tr>
    		<th>兴趣</th>
    		<td align="left">居左</td>
    		<td align="right">居右</td>
    		<td valign="top">有序列表
    			<ol>
    				<li>Coffee</li>
    				<li>Milk</li>
    			</ol>
    		</td>
    		<td align="left">无序列表
    			<ul>
    				<li>苹果</li>
    				<li>香蕉</li>
    				<li>菠萝</li>
    			</ul>
    		</td>
    	</tr>
    </table>
    <hr/>
    

    效果:

    注意:<style>淘汰了旧的bgcolor属性、<font>标签、align属性

    <h1 style="text-align:center">This is a heading</h1>

    <p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>

    <h2 style="background-color:red">This is a heading</h2>

     

     

    其他常见:

    背景图像:

      • <table background="/i/eg_bg_07.gif">
      • <td background="/i/eg_bg_07.gif">

    背景颜色:

      • <table bgcolor="red">
      • <td bgcolor="red">

     cellpadding 和cellspacing:

    frame:

     

  • 相关阅读:
    Hubble.net 值得纪念的一天
    Hubble.net 0.5 版本开发完成
    计算任意数值的阶乘
    Hubble.net 建表语句 Create Table
    Linq to SQL 插入数据时的一个问题
    盘古分词中文人名识别算法介绍
    盘古分词功能简介
    最长不完全匹配子串频率计算eaglet 的解法
    背包分组问题的解法
    SharePoint 2010与2007的区别 配置基于表单的身份认证
  • 原文地址:https://www.cnblogs.com/jszfy/p/12787901.html
Copyright © 2011-2022 走看看