css表格和表单

表格:table,也可以设置布局,现已被div盒子所替代。那么大概的一个格式就是table-th-tr-td,th:表头,边框线border的值collapse

<!DOCTYPE html>
<html lang='en'>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表格</title>
<style type="text/css">
.title {
    font-weight: bold;
}
table{
        border-collapse:collapse;
    }
tr:nth-child(even){
    background-color:#FCC;
}
tr:hover{
    background-color:#FF6;
}
</style>
</head>

<body>
<table width="767" height="257" border="1" align="center">
  <tr class="title">
    <th scope="col">学号</th>
    <th scope="col">姓名</th>
    <th scope="col">性别</th>
    <th scope="col">住址</th>
  </tr>
  <tr>
    <td align="center">1</td>
    <td align="center">孙悟空</td>
    <td align="center">男</td>
    <td align="center">花果山</td>
  </tr>
  <tr>
    <td align="center">2</td>
    <td align="center">沙和尚</td>
    <td align="center">男</td>
    <td align="center">大唐</td>
  </tr>
  <tr>
    <td align="center">3</td>
    <td align="center">唐僧</td>
    <td align="center">男</td>
    <td align="center">水里</td>
  </tr>
</table>
</body>
</html>
image.png

表单

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
    <style type="text/css">
        p{
            margin: 0px;
        }
    </style>
</head>
<body>
    
    <form action="#" class="noone">
        <fieldset>
            <legend>基本信息</legend>
        <label for="um">您的名字</label>    
        <input id='um' type="text" name="username">
        <br><br>
        
        <label for="sex">手机号码</label>   
        <input id='sex' type="text" placeholder="CN +86中国区">
        <br><br>
        </fieldset>
    </form>
</body>
</html>
image.png
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • (注1:如果有问题欢迎留言探讨,一起学习!转载请注明出处,喜欢可以点个赞哦!)(注2:更多内容请查看我的目录。) ...
    love丁酥酥阅读 9,845评论 2 5
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,687评论 1 92
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 9,800评论 0 0
  • 今天一整天的静心下来,看到自己卡在极度的无力几尽绝望里。 我看到自己的无力与恐惧,我不能表达愤怒,因为这些愤怒都指...
    紫烟_3cfc阅读 1,196评论 0 2
  • 在如此多的幻境, 呼唤她的名, 我无声的呼吸, 编织成歌。 ---写于2016年9月。
    卡布奇诺花蜜阅读 3,584评论 0 50