构成:结构、样式、行为
标签语义化 标签语义化的优点:显示清晰的页面结构、利于开发和维护、利于SEO、方便其他设备读取
排版标签:h1-h6 p < hr/> < br/> div span
文本格式化标签:推荐使用后边的语义更强
<b></b>and<strong></strong>文字加粗
<i></i>and<em></em>文字斜体
<s></s>and<del></del>文字删除线
<u></u>and<ins></ins>文字下划线
预格式化文本标签:<pre></pre> 写啥样显示哈样识别空格和换行
图像标签:<img src=""/>
图像标签属性:src alt title width height border
链接标签:<a href=" "></a>
链接标签属性:href target target是链接打开方式值有self默认值/_blank新窗口打开
锚点:<a href="#id"></a>
在head标签中添加base标签可以设置整体链接的打开方式
//给页面所有链接的打开方式设置为在新页面打开注释标签:<!-- -->
块级标签:div p h1-h6 ul li ol
行内标签:span strong em del ins
特殊字符:空格 小于号 < 大于号 >
表格是用来集中显示数据的
<table> <tr><td>一列</td><td>二列</td><td>三列</td></tr> <tr><td>1</td><td>2</td><td>3</td></tr> </table>表头单元格标签:<th></th>
表格标题(表头)标签:<caption></caption>紧跟table标签之后
border width height align表格在页面中的水平对齐方式,常用属性left、center、right
cellspacing单元格之间的空白间距,单边框表格可以将cellspacing的值设为0
cellpadding单元格内容与单元格边框之间的空白间距
合并单元格:
跨行合并:rowspan=“合并单元格的个数”
跨列合并:colspan=‘合并单元格的个数’
注意要将合并后多出的单元格删除
表格结构:
<thead></thead> 定义表头
<tbody></tbody> 定义表格主体
<tfoot></tfoot> 定义表格注脚
无序列表 ul>li
有序列表 ol>li
自定义表格 dl >dt dd
收集的用户信息怎么传递给服务器?
通过form表单域
目的:
在HTML中,form标签被用于定义表单域,以实现用户信息的收集和传递,form中的所有内容都会被提交给服务器。
语法
<form action="url地址" method="提交方式" name="表单名称"> 各种表单控件 </form>常用属性:
属性属性值作用actionurl地址用于指定接收并处理表单数据的服务器程序的url地址。methodget/post用于设置表单数据的提交方式,其取值为get或post。name名称用于指定表单的名称,以区分同一个页面中的多个表单。 <input type="text" value="parker'/>
属性属性值描述typetext单行文本输入框password密码输入框radio单选按钮checkbox复选框button普通按钮submit提交按钮reset重置按钮image图像形式的提交按钮file文件域 属性说明作用type表单类型用来指定不同的控件类型value表单值表单里面默认显示的文本name表单名字页面中的表单很多,name主要作用就是用于区别不同的表单。checked默认选中表示那个单选或者复选按钮一开始就被选中了为了提高用户体验点击label包裹的元素会触发绑定的input焦点
使用方法一:
<label>用户名:<input type="text" value="parker'/></label>使用方法二:
<label for="nc">用户名:</label> <input type="text" id="nc"/>多行文本输入框,文本域:多用于留言板
<textarea>我是默认文本</textarea>