陈霞-20201027

一、知识总结

1. 表格   
<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"   单元格之间的间距
2.表格的基本组成(三部分:表头,thead;正文,tbody;表尾,tfoot)   
<table border="1" cellspacing="0" cellpadding="20">         
<thead>             
<tr>                                        
<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>表示表尾。
3. 合并单元格    
<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>
3.form表单   
数据的一个载体 
<form action="dologin.jsp" method="get">    
action:处理数据的地址  
method:提交方式,有两个值 get 和 post 
post和get的异同点:   相同点:get与 post都能够提交表单数据。 不同点:get通过请求头(地址)发送数据; post能过请求体发送数据;    Get提交方式的优点:发送数据速度快。 缺点:发送的数据量有大小限制);         
发送数据在地址栏可见不安全;发送的数据类型只能是文本(字符串);    Post提交方式优点:发送数据相对安全;                发送数据理论上没有大小限制,建议不要太大,否则上传太慢影响浏览器运行速度;                 发送的数据类型多:文件、图片、文本。    缺点:发送数据速度相对较慢。
4. 表单元素 
text 单行文本框  password 密码框    radio 单选框 (通过name属性分组)  submit 提交按钮 reset 重置按钮  button 普通按钮 image 图像按钮  hidden 隐藏域  file 文件域    email 邮箱输入框 url url输入框  date 日期类型   time 时间类型   month 月类型   week 周类型       number 数字输入框 search 搜索意义的表单       color 颜色选择框

二、心得体会
感觉今天的表格好难呀,讲的时候感觉条理清晰,也挺简单的,就是换一下属性,但是实际操作起来还是挺麻烦的,出错率很高,云里雾里的,仿照着讲的可以慢慢做,但是自己心里的整体框架,步骤,操作都是稀里糊涂,这应该是缺少练习还有就是讲的有点快,或者是自己的反应能力及理解能力太差的原因,私底下还得要多多努力才能跟的上。

标签

评论

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