表格标签

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>表格标签</title>

</head>

<body>

    <!--

        ##表格标签

        ```html

        <table>

            <caption>表格名称</caption>

            <tr>

                <th>一个单元格</th>

                <th>一个单元格</th>

            </tr>

            <tr>

                <td>一个单元格</td>

                <td>一个单元格</td>

            </tr>

        </table>

        ```

        **table常见属性**

        - border:边框宽度

        - width:宽度

        - height:高度

        **tr的属性**

        - align: 对齐方式

        **td的属性**

        - width:宽度

        - height:高度

        - 合并单元格:(值的写法,合并几个单元格,值就写几)

            - 行合并:rowspan=""  将几行合并在一起,看上去是一列的几个单元格合并成了一个

            - 列合并:colspan=""  将几列合并在一起,看上去是一行的几个单元格合并成了一个

        **td和th**

        - 区别:

            - th中间的内容默认粗体居中显示

            - th一般用于做表头

     -->

    <!-- 一个简单的表格 -->

    <table border="1" width="50%" height="50%" bgcolor="gray">

        <caption>用户列表</caption>

        <tr align="center">

            <th>序号</th>

            <th>姓名</th>

            <th>性别</th>

        </tr>

        <tr align="center">

            <td>1</td>

            <td>张三</td>

            <td>男</td>

        </tr>

        <tr align="center">

            <td>2</td>

            <td>李四</td>

            <td>女</td>

        </tr>

    </table>

    <!-- 合并单元格 -->

    <table border="1" width="50%" height="50%" bgcolor="gray">

        <caption>用户列表</caption>

        <tr align="center">

            <th>默认单元格</th>

            <th>默认单元格</th>

            <th>默认单元格</th>

        </tr>

        <tr align="center">

            <td colspan="3">这是一个列合并单元格(colspan="3")</td>

        </tr>

        <tr align="center">

            <td rowspan="2">这是一个行合并单元格(rowspan="2")</td>

            <td>默认单元格</td>

            <td>默认单元格</td>

        </tr>

        <tr align="center">

            <td>默认单元格</td>

            <td>默认单元格</td>

        </tr>

    </table>

    <!-- 表格嵌套 -->

    <table border="1">

        <caption>表格的嵌套</caption>

        <tr>

            <td rowspan="3">

                <table>

                    <tr>

                        <td>2</td>

                        <td>2</td>

                    </tr>

                    <tr>

                        <td>2</td>

                        <td>2</td>

                    </tr>

                </table>

            </td>

        </tr>

        <tr>

            <td>1</td>

            <td>1</td>

            <td>1</td>

        </tr>

        <tr>

            <td>1</td>

            <td>1</td>

            <td>1</td>

        </tr>

    </table>

</body>

</html>

表单

这段我必须承认我非常无耻的抄了别人的笔记…

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>表单标签</title>

</head>

<body>

    <!--

        * 表单标签（**********）

            * 收集用户输入的数据

            * 表单的标签

            <form >

                * form的属性

                    * action="表单的提交路径"

                        * http://www.baidu.com

                        * html页面

                    * method="提交方式（默认是get方式）"（面试题）

                        * form表单的提交方式有哪些？（get和post的区别）

                            * 答：form表单提交方式有很多，常用的有两种post和get

                                * post和get提交方式的区别：

                                    * get方式会把参数列表显示在地址栏上，post方式不会（请求体）。

                                    * get方式说明网站安全级别较低，post安全级别较高。

                                    * get方式不支持大数据，post支持大数据。

                            * 推荐大家使用post方式。

                * 用户输入的内容

                <input type="类型" name="名称(必须要指定)" value="是否指定value属性" />

                    * name属性必须要指定，value可以看情况指定

                * type="text"           普通的文本框

                    * name必须指定

                * type="password"       密码框

                    * * name必须指定

                * type="radio"          单选按钮

                    * name必须指定  value必须指定

                    * name的属性，值要相同

                    * 默认值：checked=checked或者true

                * type="checkbox"       多选按钮

                    * name必须指定  value必须指定

                    * 默认值：checked=checked或者true

                * type="reset"          重置：恢复到最初的状态

                * type="submit"         提交表单

                    * 点击提交后，地址栏发生了变化（?sex=on）

                    * 在普通的文本框上添加name属性 name="username"之后，点击提交，地址栏发生了变化（?username=haha&sex=on）

                        String str = "?username=haha&sex=on";

                    * ?username=zhangsan&password=123&sex=nan&love=zq   

                * type="file"           选择文件

                    * name属性指定

                * type="hidden"         隐藏组件

                    * name指定 value指定    

                * type="button"         按钮

                    * value="显示的文字"

                    * 和js（javascript）   绑定事件

                * type="image"          图片

                    * 提交    引入外部的一个文件（图片）

                * 声明选择框

                    <select name="city">

                        <option value="bj"></option>

                        <option value="sh"></option>

                    </select>   

                * <textarea>文本域

                    * rows="行"

                    * clos="列"

                    * name属性指定

                    * selected="selected"   代表默认值

            </form>

     -->

     <form>

        输入姓名:<input type="text" name="username"/><br/>

        输入密码:<input type="password"/><br/>

        选择性别:<input type="radio" name="sex" value="male"/>男

                <input type="radio" name="sex" checked="checked" value="femal"/>女<br/>

        选择爱好:<input type="checkbox" name="love" value="basketball"/>篮球

                <input type="checkbox"/>足球

                <input type="checkbox"/>冰球

                <input type="checkbox"/>排球<br/>

        选择附件:<input type="file"><br/>

        隐藏组件:<input type="hidden" name="userID" value="001"><br/>

        选择城市:<select name="city">

                    <option>请选择</option>

                    <option value="wh">武汉</option>

                    <option value="hh">黑河</option>

                </select>

                <input type="reset"/>

                <input type="submit"/><br/>

                <input type="button" value="test"/>

                <input type="image" src="../imgs/tj.png" >

        个人简介:<textarea cols=10 rows="20"></textarea>

     </form>

</body>

</html>

其他

其他的忽略了…实在不感兴趣…

HTML学习笔记(下)的更多相关文章

  1. Zookeeper学习笔记(下)

    这是ZK学习笔记的下篇, 主要希望可以分享一些 ZK 的应用以及其应用原理 我本人的学习告一段落, 不过还遗留了一些ZK相关的任务开发和性能测试的任务, 留待以后完成之后再通过其他文章来进行分享了 Z ...

  2. 菜鸟教程之学习Shell script笔记(下)

    菜鸟教程Shell script学习笔记(下) 以下内容是学习菜鸟教程之shell教程,所整理的笔记 菜鸟教程之shell教程:http://www.runoob.com/linux/linux-sh ...

  3. Android学习笔记（十七）——数据库操作（下）

    //此系列博文是<第一行Android代码>的学习笔记,如有错漏,欢迎指正! 这一次我们来试一试升级数据库,并进行数据库的CRUD操作,其中, C 代表添加(Create) ,R 代表查询 ...

  4. Maven学习笔记-03-Eclipse下maven项目在Tomcat7和Jetty6中部署调试

    现在最新的Eclipse Luna Release 已经内置了Maven插件,这让我们的工作简洁了不少,只要把项目直接导入就可以,不用考虑插件什么的问题,但是导入之后的项目既可以部署在Tomcat也可 ...

  5. Ext JS4 学习笔记之发送表单（Form）时也将表单下的表格（Grid）数据一同发送的方法

    Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法 昨天在开发的时候遇到个小问题,就是如何将Grid的内容与Form一起发送到服务器端.默认情况下,表单(F ...

  6. PHP学习笔记----IIS7下安装配置php环境

    原文:PHP学习笔记----IIS7下安装配置php环境 Php如何安装 Php版本的选择 Php在windows下的(php5.4.7)有两种版本: VC9 x86 Non Thread Safe ...

  7. 一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx、supervisor、mysql环境搭建

    作为.neter,看到.net core 2.0的正式发布,心里是有点小激动的,迫不及待的体验了一把,发现速度确实是快了很多,其中也遇到一些小问题,所以整理了一些学习笔记: 阅读目录 环境说明 安装C ...

  8. docker学习笔记（一）—— ubuntu16.04下安装docker

    docker学习笔记(一)—— ubuntu16.04下安装docker 原创 2018年03月01日 14:53:00 标签: docker / ubuntu 1682 本文开发环境为Ubuntu ...

  9. input子系统学习笔记六 按键驱动实例分析下【转】

    转自:http://blog.chinaunix.net/uid-20776117-id-3212095.html 本文接着input子系统学习笔记五 按键驱动实例分析上接续分析这个按键驱动实例! i ...

随机推荐

  1. XCode 4.6下XIB文件提示“...could not be opened..."的问题

    最近更新了Mac系统和XCode,当我把一个以前的项目用Xcode5打开以后,再用Xcode4.6打开时,选中XXXX.xib/storyboard文件,有的文件会弹出 "The docum ...

  2. 个人博客开发之 ueditor 安装

  3. 寒城攻略：Listo 教你用Swift 语言编写 IOS 平台流媒体播放器

    先展示播放器效果:   依然继承 Listo 本人的强迫症,还是从最初到完毕完整的写一个攻略来记录一下,这里声明 Listo 本人也是看了非常多的戴维营攻略才总结分享给大家这一篇攻略的. 首先,Lis ...

  4. wpf数据绑定更新通知

    类似于这样子的;大致的意思是:一个代码变量,通过改变变量的值,绑定这个变量的这个圆颜色也在变化 就是一种心跳效果 在网上数据触发的感觉不多,废了不少时间,这里做个总结 1:通知 class Notif ...

  5. python 推荐算法

    每个人都会有这样的经历:当你在电商网站购物时,你会看到天猫给你弹出的“和你买了同样物品的人还买了XXX”的信息:当你在SNS社交网站闲逛时,也会看到弹出的“你可能认识XXX“的信息:你在微博添加关注人 ...

  6. 第一篇：尽量多的以 const/enum/inline 替代 #define

    前言 在面向过程语言,如 C 语言中,#define 非常常见,也确实好用,值得提倡.但在如今面向对象的语言,如 C++ 语言中,#define 就要尽量少用了. 为何在 C++ 中就要少用了呢? 这 ...

  7. Android开发：《Gradle Recipes for Android》阅读笔记(翻译)2.1——设置项目参数

    问题: 开发的时候经常需要向项目中添加一些额外的参数或者硬编码的值. 解决方案: 使用ext块设置公用的值.如果需要从build文件中移除这些值,可以将参数放到gradle.properties文件中 ...

  8. Linux - Ubuntu Server基础

    Ubuntu Server:部署环境,用来部署项目的server系统. XShell:用来连接linux的工具.web项目要部署到远程服务器上,所以需要XShell来连接远程服务器. pycharm: ...

  9. hdu 5471(状压DP or 容斥)

    想了最复杂的思路,用了最纠结的方法,花了最长的时间,蒙了一种规律然后莫名其妙的过了. MD 我也太淼了. 后面想了下用状压好像还是挺好写的,而且复杂度也不高.推出的这个容斥的规律也没完全想透我就CAO ...

  10. #1589 : 回文子串的数量(Manacher)

    #1589 : 回文子串的数量 时间限制:10000ms 单点时限:1000ms 内存限制:256MB 描述 给定一个字符串S,请统计S的所有|S| * (|S| + 1) / 2个子串中(首尾位置不 ...