黄其威-20201026

知识总结:

 form表单   数据的一个载体
    <form action="dologin.jsp" method="get"> 
    action:处理数据的地址
    method:提交方式,有两个值 get 和 post

post和get的异同点:
    相同点:get与 post都能够提交表单数据。
    不同点:get通过请求头(地址)发送数据; post能过请求体发送数据;
Get提交方式
    优点:
        发送数据速度快。
    缺点:
        发送的数据量有大小限制,大概带2048B(2KB);
        发送数据在地址栏可见不安全;
        发送的数据类型只能是文本(字符串);
Post提交方式
    优点:
        发送数据相对安全;
        发送数据理论上没有大小限制,建议不要太大,否则上传太慢影响浏览器运行速度;
        发送的数据类型多:文件、图片、文本。
    缺点:
        发送数据速度相对较慢。
    

                                               表格table
             表格
            <table border="1" cellspacing="0" cellpadding="20">
            <tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>
                <td>4</td>
                <td>5</td>
                <td>6</td>
            </tr>
            <tr>
                <td>2</td>
                <td>3</td>
                <td>4</td>
                <td>5</td>
                <td>6</td>
                <td>7</td>
            </tr>
            <tr>
                <td>3</td>
                <td>4</td>
                <td>5</td>
                <td>6</td>
                <td>7</td>
                <td>8</td>
            </tr>
            <tr>
                <td>4</td>
                <td>5</td>
                <td>6</td>
                <td>7</td>
                <td>8</td>
                <td>9</td>
            </tr>
            <tr>
                <td>5</td>
                <td>6</td>
                <td>7</td>
                <td>8</td>
                <td>9</td>
                <td>10</td>
            </tr>
            <tr>
                <td>6</td>
                <td>7</td>
                <td>8</td>
                <td>9</td>
                <td>10</td>
                <td>11</td>
            </tr>
            <tr>
                <td>7</td>
                <td>8</td>
                <td>9</td>
                <td>10</td>
                <td>11</td>
                <td>12</td>
            </tr>
            </table>

        注:border="1px"   边框设置
        cellpadding="20"  单元格内间距
        cellspacing="0"   单元格之间的间距
            表格的基本组成(三部分:表头,thead;正文,tbody;表尾,tfoot)
            <table border="1" cellspacing="0" cellpadding="20">
            <thead>
                <tr>
                    <th>序号</th>
                    <th>姓名</th>
                    <th>年级</th>
                    <th>学号</th>
                    <th>性别</th>
                    <th>备注</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                    <td>6</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                    <td>6</td>
                    <td>7</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                    <td>6</td>
                    <td>7</td>
                    <td>8</td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td>a</td>
                    <td>b</td>
                    <td>c</td>
                    <td>d</td>
                    <td>e</td>
                    <td>f</td>
                </tr>
            </tfoot>
            </table>
        table内包含三部分:<thead></thead>表示表头,其中<tr></tr>标签代表行,<th></th>表示列(具有加黑加粗效果);<tbody></tbody>代        表正文部分用<td>表示单元格;<tfoot></tfoot>表示表尾。
    合并单元格
            <table border="1" cellspacing="0" cellpadding="20">
            <tr>
                <td>1</td>
                <td colspan="3">2</td>
                <td>3</td>
                <td>4</td>
            </tr>
            <tr>
                <td rowspan="3">2</td>
                <td>3</td>
                <td>4</td>
                <td>5</td>
                <td>6</td>
                <td>7</td>
            </tr>
            <tr>
                <td>4</td>
                <td colspan="4">5</td>
            </tr>
            <tr>
                <td>5</td>
                <td>6</td>
                <td>7</td>
                <td>8</td>
                <td>9</td>
            </tr>
            <tr>
                <td>5</td>
                <td colspan="2">6</td>
                <td>7</td>
                <td>8</td>
                <td>9</td>
            </tr>
            <tr>
                <td>6</td>
                <td>7</td>
                <td>8</td>
                <td>9</td>
                <td>10</td>
                <td>11</td>
            </tr>
            <tr>
                <td>7</td>
                <td>8</td>
                <td>9</td>
                <td>10</td>
                <td>11</td>
                <td>12</td>
            </tr>
            </table>


table内包含三部分:<thead></thead>表示表头,其中<tr></tr>标签代表行,<th></th>表示列(具有加黑加粗效果);<tbody></tbody>代表正文部分用<td>表示单元格;<tfoot></tfoot>表示表尾。
                            border="1px"   边框设置
                            cellpadding="20"  单元格内间距
                            cellspacing="0"   单元格之间的间距…
                            rowspan
                             colspan
表单元素:
    text 单行文本框
    password 密码框
    radio 单选框 (通过name属性分组)
    checkbox 多选框
    submit 提交按钮
    reset 重置按钮
    button 普通按钮
    image 图像按钮
    hidden 隐藏域
    file 文件域
    email 邮箱输入框
    url url输入框
    date 日期类型
    time 时间类型
    month 月类型
    week 周类型
    number 数字输入框
    range 滑动条
    search 搜索意义的表单
    color 颜色选择框
特殊符号
     空格 &nbsp
    

心得体会:通过一上午的学习

表格提供了HTML 中定义表格式数据的方法。
表格中由行中的单元格组成。
表格中没有列元素,列的个数取决于行的单元格个数。通过这两天的实训,我对静态页面的组成有了很大的认知,让我受益匪浅,老师讲的深入浅出,很容易让人明白。继续加油吧

标签

评论

© 2021 成都云创动力科技有限公司 蜀ICP备20006351号-1