`
umgsai
  • 浏览: 104416 次
  • 性别: Icon_minigender_1
  • 来自: 广州
文章分类
社区版块
存档分类
最新评论

表格的漂亮css展示

 
阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
 </head>

 <body>
  <table class="mytable" cellpadding="0" cellspacing="0">
 <caption> 经营类项目验收费用决算审批表</caption>
    <tr>
     <th>项目名称</th>
        <td><input type="text"  /></td>
        <th >项目负责人</th>
        <td><input type="text"  /></td>
    </tr>
   
    <tr>
     <th>项目目标完成情况<br />完成时间</th>
        <td colspan="3"><textarea cols="55" rows="4"></textarea></td>
    </tr>
   
    <tr>
     <th>费用预算总额<br />单位:元(现金)</th>
        <td><input type="text"  /></td>
        <th>费用实际列支总额<br />(现金)</th>
        <td><input type="text"  /></td>
    </tr>
    <tr>
     <th>费用预算总额 <br />(物品)</th>
        <td><input type="text"  /></td>
        <th>费用实际列支费用总额<br />(物品)</th>
        <td><input type="text"  /></td>
    </tr>
    <tr>
     <th>内部资源预算总额</th>
        <td><input type="text"  /></td>
        <th>内部资源实际列支总额</th>
        <td><input type="text"  /></td>
    </tr>
    <tr>
     <th>项目费用,列支明细<br />(人力及开发费用)</th>
        <td colspan="3"><textarea cols="55" rows="4"></textarea></td>
    </tr>
    <tr>
     <th>项目费用,列支明细<br />(非人力成本报销明细及内部其它结算明细)</th>
        <td colspan="3"><textarea cols="55" rows="4"></textarea></td>
    </tr>
    <tr>
     <th>实际税收成本</th>
        <td colspan="3"><textarea cols="55" rows="4"></textarea></td>
    </tr>
    <tr>
     <th>实际业务提成</th>
        <td colspan="3"><textarea cols="55" rows="4"></textarea></td>
    </tr>
</table>
css代码
<style>
   table,th,td, caption{ margin:0px; padding:0px; line-height:18px; color:#000; font-size:12px; font-family:Microsoft Yahei;}
   .mytable th{  background:#BCE774; text-align:left; font-weight:normal; width:150px;  padding:6px;}
   .mytable caption{ background:#328AA4; color:#FFF; line-height:30px; border:1px solid #000;}
   .mytable td{background:#ECFBD4; padding:3px;  }
   .mytable th,.mytable td{border-top:1px solid #000;border-left:1px solid #000; }
   .mytable{border-bottom:1px solid #000;border-right:1px solid #000;}
</style>
 </body>
</html>

 

 http://www.html5cn.org/article-1517-1.html

  • 大小: 72.8 KB
分享到:
评论

相关推荐

    漂亮的表格 HTML表格

    漂亮的表格html,鼠标移动到表格上会自动通过CSS效果选中一行以及一列。

    JQuery&CSS;&CSS;+DIV实例大全.rar

    2.jQuery+CSS漂亮蓝色三级菜单下载 3.jquery+css实现简洁两级横向导航菜单,带动态效果 4.jQuery+CSS实现竖形动感导航菜单效果 5.jquery+div漂亮SmartMenu下拉菜单气泡透明效果 6.jQuery+div实现flash炫彩...

    CSS制作政府公文的代码

    应程序要求,全部用p 类展示。其他要求请自行更改! 关于有序列表OL: 直接对ol定义text-indent:4em;IE内这4em是在序列号前边,FF,GG内,是在序列号和正文中间。 改用对OL使用padding-left:4em &lt;!DOCTYPE ...

    HTML5设计模板(28个).zip

    366.蓝色侧栏大气css3商业服务整站模板 367.渐变大气交互式响应式设计html5模板 368.精美漂亮的个人web简历html5博客模板下载 369.深色天空背景宽屏跳转产品展示模板 370.漂亮大屏大气婚纱摄影商业网站整站模板 371....

    HTML5+CSS3构建同页面表单间的动画切换

    既可为网页瘦身,又可实现漂亮的网页效果,快快收藏吧。这篇稿件将描述如何在HTML5中,使用CSS3的目标伪类“:target”来创建注册和登录两个表单、并实现它们在同一个页面中的显示转换。此演示目的是向用户展示从登录...

    60个超实用JavaScript网页特效收集(珍藏版)

    超级大表单验证,漂亮的日历,翻页代码,树形菜单,让你的文本渐隐渐现,滚动的图片,圆边圆角实现,跳动的菜单,漂亮的css表格,二十三 经典的带阴影的可拖动的浮动层,内容多了下拉条自动出现,仿flash菜单蓝色,...

    JavaScript +css

    基于jquery的UI 界面 包含了常用的list 滚动 等表格效果

    makeSticky:用于制作粘性标题的 jQuery 插件

    在使用标题时,特别是在表格中,更具体地说:移动表格中,您真的没有奢侈地保持合理的水平宽度。 我的意思是,您是否尝试过在 iPhone 上制作流体表? 哦,你有吗? 一个 20 列(自作聪明)怎么样? 确切地。 不漂亮...

    网趣网上购物系统时尚版V13.0

    网站导航条支持文字式和图片式2类,文字式采用流行的div+css开发设计,界面新颖美观,采用文字式导航条更有利于搜索引擎抓取页面信息,同时程序还支持原有的图片式菜单效果,后台可轻松切换使用,以上2类导航条菜单...

    网趣网上购物系统时尚版 V9.0

    网站导航条支持文字式和图片式2类,文字式采用流行的div+css开发设计,界面新颖美观,采用文字式导航条更有利于搜索引擎抓取页面信息,同时程序还支持原有的图片式菜单效果,后台可轻松切换使用,以上2类导航条菜单...

    网趣网上购物系统时尚版

    网站导航条支持文字式和图片式2类,文字式采用流行的div+css开发设计,界面新颖美观,采用文字式导航条更有利于搜索引擎抓取页面信息,同时程序还支持原有的图片式菜单效果,后台可轻松切换使用,以上2类导航条菜单...

    网趣网上购物系统的部分特点与精华

    网站导航条支持文字式和图片式2类,文字式采用流行的div+css开发设计,界面新颖美观,采用文字式导航条更有利于搜索引擎抓取页面信息,同时程序还支持原有的图片式菜单效果,后台可轻松切换使用,以上2类导航条菜单...

Global site tag (gtag.js) - Google Analytics