HTML5
今天被HR(人很好)问道前台,给一个图像模板让我做一下布局(div+css),自己长久时间没用,可能忘记,就看看之前的笔记和http://www.w3school.com.cn/借此机会把HTML5也学了吧!感觉现在前段HTML5这一块,是比较火。然后查漏补缺,做一下笔记。
<aname="ds">跳转内连接</a>一般用于文档内的链接
<ahref="#ds">asdhklahdsk</a>
引入CSS三种方式:linkrel属性href<style><style>style="background-color:brown"三中方式的优先级依次提高。推荐使用第一种。
表格中设计table里头<caption>重要表格</caption>显示在中间。style="border-collapse:collapse"表格合并ul是无序列表ol有序列表,有序列表的一个常用属性<olstart="10">从10开始
嵌套列表:可以无序,有序嵌套
<ul>
<li>动物
<ul>
<li>猫</li>
<li>够</li>
</ul>
</li>
</ul>
自定义表格:<dl>
<dt>helloword</dt>
<dd>aada</dd>
<dt>helloword</dt>
<dd>aada</dd>
</dl>
div+css布局方式:简单练习一下:
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style type="text/css"> /*初始化声明,消除浏览器不同,margin 外边框的不一样*/ body{ margin: 0px; padding: 0px; } .container{ width: 100%; height: 980px; background-color: gray; } .header{ width: 100%; height: 10%; background-color: aqua; } .content_menu{ float: left;/*添加浮动*/ width: 30%; height: 80%; background-color: cornflowerblue; } .content_body{ float: left; width: 70%; height: 80%; background-color: pink; } .foot{ clear: both;/*清除浮动*/ width: 100%; height: 10%; background-color: chartreuse; } </style> </head> <body> <div class="container"> <div class="header">头部</div> <div class="content_menu">菜单内容</div> <div class="content_body">主题内容</div> <div class="foot">尾部</div> </div> </body> </html>
当然还有一种布局方式table,自己用的比较少。感觉其他人也用的比较少。
基本的表单:
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <form> 用户名:<input type="text" name="username" value=""/><br/> 密码:<input type="password" name="password" value=""/> <!--单选--> 男 <input type="radio" name="sex"/> 女 <input type="radio" name="sex"/><br/> 苹果:<input type="checkbox" name="shuiguo"/> 香蕉:<input type="checkbox" name="shuiguo"/> 梨:<input type="checkbox" name="shuiguo"/> <!--下拉--> <br/> <select> <option>daimajia.iteye.com</option> <option>百度</option> <option>www.baidu.com</option> </select> <br/> <!--文本域,是可以在表单外创建的--> <textarea cols="20" rows="10"> asdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss10行20列 </textarea> <br/> <input type="button" value="按钮"/> <br/> <input type="submit" value="确认"> </form> </body> </html>
表单提交的方式,常用的两种:post,get,post一般用于提交数据量大,或者数据保密,安全性能高。get一般用于数据简单,资源定位(淘宝上很多网店就是),不需要太高的保密方式。
相关推荐
表格的现在还是较为常用的一种标签,但不是用来布局,常见处理、显示表格式数据。在HTML网页中,要想创建表格,就需要使用表格相关的标签。<table> <tr> <td>单元格内的文字</td> ...