html归根到底就是一堆标签的集合从而构成网页的基本框架，但是只有html是远远不够的（因为做出来的贼丑）所以需要css进行页面的渲染
html的标签书写的两种形式 – a. 自闭合标签：<标签名 /> – b. 非自闭合标签：<标签名></标签名>
img标签 书写格式 <img src="照片的路径" width="200px height="200px" title="照片停留时显示的文字" alt="假如路径出现问题时显示的文字"></img>
先看一个例子理解下什么是列表
firstsecondthird上面就是一个列表(我直接用代码写的就显示上面的结果 可以看出markdown支持html部分语言) 代码如下 <ul> <li>first</li> <li>second</li> <li>third</li> </ul>
如果要显示有序列表
firstsecondthird代码如下 <ol type> <li>first</li> <li>second</li> <li>third</li> </ol> type可以有 a,A,1,I进行显示 如果想自定义标签的话
下面是我的标签 first second代码如下 <dl> <dt>下面是我的标签</dt> <dd>first</dd> <dd>second</dd> </dl>
先看例子 学生 老师 属性介绍 name：当name值一样的时候只能选择一个按钮 value：是存放后台数据的标签 以便找寻对应的数据 identify=0 后台会根据0找到0对应的数据 checked 是默认的选项 上述代码默认是选择学生
标签 代码如下； <select name="address"> <option value="">--请选择--</option> <option value ="0" selected="selected">中国</option> <option value ="1">美国</option> <option value ="2">英国</option> <option value ="3">日本</option> </select>
类似于excel的表格
table标签 属性：
border ：修饰边框 默认颜色为黑色 可以通过 bordercolor 设置边框的颜色cellpadding 设置文字内容与内边框的距离cellspacing 设置内边框与外边框的距离tr2>th4 使用tab键快速生成代码 效果： 代码如下
<table border="1px" cellspacing="1 px" cellpadding="4px" bordercolor="red"> <tr height="35px">//可以设置单元格的高度 <th width="100px">姓名</th> //也可以使用css对标签进行处理 因为这样写的话对每个标签都要写 宽度和高度 <th>性格</th><!--th加黑居中--> <th>爱好</th> <th>颜值</th> <th>看书</th> </tr> <tr align="center"> <td>girlgod</td> <td>豪爽</td> <td>吃</td> <td>高</td> <td>java</td> </tr> </table>当然这样肯定是不够的的 我们在word中会经常有的动作就是合并单元格 table当然可以进行这样的动作 横向合并属性 colspan 从当前位置开始向右进行合并单元格 记得合并几个就要在所在的tr标签相应的删除几个td标签 纵向合并标签 roespan 从当前位置开始向下进行合并单元格 ，记得合并多少个单元格就在向下的几个tr标签内删除一个td标签
~掌握了这个就可以做网页版的个人简历了
标签 <a href="url（或者本地资源路径的html）">我是一个链接</a> 例子 百度 上面的链接就是用以下代码写的 <a href="http://www.baidu.com" target="_blank">百度</a> target属性： _blank 在新的标签页显示 _parent 在父级页面显示 _self 在当前页面显示 _top 在顶层页面显示 target本意是目标的意思 那么当然可以指定他到name指定的位置进行操作 即将当前链接显示的内容放在 name指定的位置显示 这个需要借助frame进行操作 大概形象以下就是现在的网页中有一部分就是将当前网页的连接内容显示信息在当前网页的某个位置
所谓的锚点就是 抛一个锚 然后到达指定的位置 经常在读小说的时候，会经常用到锚点点击目录第几章，进而跳转到具体的页数
<a href="#名字">介绍</a> 在指定的位置加上 <a name="名字"></a> 这样就可以通过点击介绍 进而跳转到指定位置 #表单的学习总结 作为前端最常用到的就是表单了，表单的主要任务就是实现与用户的交互。比如在登录 注册时经常遇到这样的表单。 注意在表单和后端进行交互时，要注意给表单加上name属性，后端就是根据name属性和value属性结合到一起组合成为键值对。 后端你通过name属性值获取到对应的value值。 ```html <input type="text" > <!--输入文本--> <input type="password"> <!---输入密码--> <input type="file"> <!--上传文本的属性 再进行长传文件和图片类时 注意在form表单上加上 enctype="multipart/form-data"--> <input type="image"><!--上传图片--> <input type="mail"><!--输入邮箱--> ``` 后端是如何接受以上的数据的哪。下面一个完成的前端和后端的代码带你了解前后端是如何进行交互的。 对于struts2框架来说 务必确保前端的name属性值和后端保持一致 ```html <form action="http://localhost:9999/demo/interactive.action" method="post" enctype="multipart/form-data"> <input type="text" name="username"> <input type="password" name="password"> <input type="image" name="photo"> <input type="submit" value="提交"></input> </form> ``` 后端写响应的接口 首先配置好对应的struts.xml做好映射 ```xml <?xml version="1.0" encoding="UTF-8"?> <!-- 引入约束 --> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache.org/dtds/struts-2.3.dtd"> <struts> <constant name="struts.i18n.encoding" value="utf-8"></constant> <package name="default" namespace="/" extends="struts-default"> <action name="interactive" class="com.sofency.action" method="{1}"> <result name="success">/success.jsp</result><!--成功之后跳转到成功界面--> </action> </package> </struts> ``` 写对应的action ```java public class action extends ActionSupport{ private String username;//对前端的属性进行对应封装 private String password; private File photo; /*写上对应的setter 和getter*/ public String interactive(){ //将文件存储到服务器 if(photo!=null){ System.out.println("文件名称:"+photoFileName); //abc.jpg System.out.println("文件MIME类型:"+photoContentType); //image/jpeg //将上传的文件保存到指定位置 photo.renameTo(new File("E:/upload/xxx.jpg")); } System.out.println(username);//这样就获取到数据了 System.out.println(password); } } ```