<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>表单样式</title>
<script type="text/javascript">
function altRows(id){
if(document.getElementsByTagName){

var table = document.getElementById(id);
var rows = table.getElementsByTagName("tr");

for(i = 0; i < rows.length; i++){
if(i % 2 == 0){
rows[i].className = "evenrowcolor";
}else{
rows[i].className = "oddrowcolor";
}
}
}
}

window.onload=function(){
altRows('alternatecolor');
}
</script>

<style type="text/css">
table.altrowstable {
font-family: verdana,arial,sans-serif;
font-size:11px;
color:#333333;
border-width: 1px;
border-color: #a9c6c9;
border-collapse: collapse;
}
table.altrowstable th {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
table.altrowstable td {
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #a9c6c9;
}
.oddrowcolor{
background-color:#d4e3e5;
}
.evenrowcolor{
background-color:#c3dde0;
}
</style>

</head>

<body>
<table class="altrowstable" id="alternatecolor">
<tr>
<th>Info Header 1</th><th>Info Header 2</th><th>Info Header 3</th>
</tr>
<tr>
<td>Text 1A</td><td>Text 1B</td><td>Text 1C</td>
</tr>
<tr>
<td>Text 2A</td><td>Text 2B</td><td>Text 2C</td>
</tr>
<tr>
<td>Text 3A</td><td>Text 3B</td><td>Text 3C</td>
</tr>
<tr>
<td>Text 4A</td><td>Text 4B</td><td>Text 4C</td>
</tr>
<tr>
<td>Text 5A</td><td>Text 5B</td><td>Text 5C</td>
</tr>
</table>
</body>
</html>

HTML表单样式的更多相关文章

  1. html5 表单样式 表单验证1 2 3

    html5 表单样式 ie9以下不支持 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...

  2. div仿checkbox表单样式美化及功能

    div仿checkbox表单样式美化及功能(checkbox的样式不好看)素材在底部: 效果图: window.css .bj { position: absolute; top: 0; left: ...

  3. 还不错的Table样式和form表单样式

    作为一个后台开发人员而言,拥有一套属于自己的前台样式是比较重要的,这里分享一下自己感觉还不错的样式,以后遇到好的,还会陆续添加 上图: 带鼠标滑动效果的table样式看起来比较清爽 样式 <he ...

  4. CSS_简介/语法结构/长度单位/应用方式/标签的样式重置/表单样式重置

    一.CSS简介:  w3c(World Wide Web Consortium):万维网联盟,是规定网页标准的一个组织(叫做Web标准) Web标准:是由w3c和其他标准化组织制定的一系列标准的集合, ...

  5. 自定义表单样式之checkbox和radio

    1,起因 最近在工作中要实现自定义式的radio样式,而我们通常使用的时默认的样式,因为自己实在想不到解决的方法,于是开始搜索,最终看到了不错的解决办法,可以完美解决我们遇到的问题. 2,原理 大家都 ...

  6. yii中调整ActiveForm表单样式

    Yii2中对于表单和字段的支持组件为ActiveForm和ActiveField, <?php $form = ActiveForm::begin([ 'id' => 'login-for ...

  7. element-ui的form表单样式改动

    造成下面样式错乱是下面自带的css样式,原本打算通过样式重写在组件内的style,发现下面相应的元素是出于封装情况的,无论样式重写在组件还是在公共样式均不能很好的解决,因为跳转到该页面时都要刷新一次, ...

  8. Bootstrap_表单_表单样式

    一.基础表单 <form > <div class="form-group"> <label>邮箱:</label> <inp ...

  9. Yii2中自定义表单样式

    use yii\widgets\ActiveForm; <?php $form = ActiveForm::begin([ 'options' => ['class' => 'for ...

随机推荐

  1. 1.4.8 拼凑在一起(putting the pieces together)

    putting the pieces together 在最高的级别,schema.xml结构如下, <schema> <types> <fields> <u ...

  2. 巧用FileShare解决C#读写文件时文件正由另一进程使用的bug

    在使用C#进行文件读写的时候,一旦对文件操作频繁,总会碰到一些令人措手不及的意外.例如经常会碰到的一个问题: System.IO.IOException: 文件“XXX”正由另一进程使用,因此该进程无 ...

  3. 【Android Studio使用教程 7】AndroidStudio问题汇总

    FindBugs:Compiler output path for module can not be null. check your module/project settings问题原因 And ...

  4. 【Android 界面效果24】Intent和PendingIntent的区别

    intent英文意思是意图,pending表示即将发生或来临的事情.  PendingIntent这个类用于处理即将发生的事情.比如在通知Notification中用于跳转页面,但不是马上跳转. In ...

  5. c++ STL:队列queue、优先队列priority queue 的使用

    说明:本文全文转载而来,原文链接:http://www.cppblog.com/wanghaiguang/archive/2012/06/05/177644.html C++ Queues(队列) C ...

  6. iphone 手机屏幕和UIView和UIWindowde 的主要的区别

    在iPhone5之前的iphone1,2,3,3s,4,4s都是320x480 iPhone5和5s的屏幕是320x568 iphone6的屏幕是375x667 iPhone6Plus的414x736 ...

  7. Pull解析-解析xml文件

    首先需要导入jar包:kxml2-2.2.2.jar 例程: main: /** * pull解析 * * @author my * */ public class DemoParserStudent ...

  8. XHTML文档基本结构

    1.什么是XHTML 即是通常所说的DIV+CSS XHTML (可扩展文本标签语言)英文表示(eXtensiblet HeperText Markup Language) (XHTML是一个扮演着H ...

  9. BI跟报表一样吗?

    一.报表≠BI很多的人认为,报表就是BI.实际上,报表只是BI的一部分,虽然BI应用的结果通常需要通过报表来展示,但是,BI绝对不仅仅是报表.其实,大家对这些概念的理解,如同15年前的ERP一样.19 ...

  10. HTTPS的工作原理

    参考自<图解HTTP> 果壳网http://www.guokr.com/post/114121/ HTTPS的工作原理 增加了一层:HTTPS流程:应用层 HTTP->SSL/TLS ...