html简单小结

1.div,table 

div标签内常用属性列表 

style 设置css样式(扩展了解style标签)

align 设置div盒子内的内容居中、居左、居右

id 引人外部对应#（井号）选择符号样式

class 引人外部对应.（句号）选择符号样式

title 设置div（标题）鼠标经过时显示文字（扩展了解 title标签）

如何使用表格  

定义表格：<table></table>
创建表行：<tr></tr>
创建列(单元格):<td></td>
标题（td加粗）:<th></th>

常用属性<*** border="*">

HTML页面的<script type="text/javascript">含义

在老的HTML版本，如果需要在HTML页面中声明一段js脚本，需要做<script type="text/javascript">的声明，表明在
<script type="text/javascript">和</script>中添加的文本是js脚本；在HTML5以后，HTML5的默认脚本语言就是
javascript即js，所以无需显示声明 type="text/javascript"，直接使用<script></script>即可。

2.form表单 

<form> 标签用于为用户输入创建 HTML 表单。
表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。
button，checkbox，file，hidden，image，password，radio，reset，submit，text
主要属性:
action URL 规定当提交表单时向何处发送表单数据。
method get/post  规定用于发送 form-data 的 HTTP 方法。

 

3.ul,ol

<ul>是无序列标签

   英文单词为“unordered list”，是闭合标签
   具体使用语法如下：<ul>内容</ul>

   <ul>
   <li>时</li>
   <li>钟</li>
   <li>boo</li>
   </ul>

<ul>type属性可定义列表情的标记付好，一般有disc（圆点）、circle（圆圈）、square（方块）、等！
<ul type="disc">

有序列表: 按照字母或数字等顺序排列的列表项目. 
注意有序列表的结果是带有前后顺序之分的编号,如果插入和删除一个列表项，编号会自动调整。
有序列表的属性标记：<type >、<start>
基本语法：     

<ol type=value1 start=value2>
    <li>项目1</li>
    <li>项目2</li>
    <li>项目3</li>
</ol>

1   规定在列表中使用的标记类型。
A,a,I,i 

4.input标签  

input 标签用于搜集用户信息。
根据不同的 type 属性值，输入字段拥有很多种形式。
输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。

文本表单 

<input type='text' name='user' />
<-- 注释:value属性代表默认用户名为user;-->   
<input type='text' name='user' value='user' />

密码表单

<--注释:其中的name内容时为了给提交的内容一个key值；-->
<input type='password' name='pwd' />

按钮 

<--注释:单纯的按钮需要结合javascript-->
<input type='button' value='按钮里显示的内容' />

提交按钮 

<--注释:一般在用户注册，填写信息完毕，一定有个提交按钮；-->
<input type='submit' value='提交按钮显示的内容' />

form表单 

input的提交按钮:单纯的input提交并不会将填写信息提交，必须放在from表单里面;
form表单：如果想要将填写的内容提交，把上边的标签放在form标签里面;

<--注释: 默认情况下,form选择的方法是GET方法,会将填写信息显示在网址中，不安全;-->
<form action='提交的网址' method='提交操用的方法:POST|GET'>
    <input type='text' name='user'>
    <input type='password' name='passwd'>
    <input type='submit' value='submit'>
</form>

form实战项目 

<--注释:  # 1). 提交你要搜索的信息  # 2). 提交  # 3). 搜索-->
<form action="https://www.sougou.com/web">
    <input type='text' name='query' />
    <input type='submit' name='submit' />
<form>

注册页面需要的标签：

单选框 

# 当有多个单选框时可以选中多个，不符合条件;
male:<input type="radio">
# 当有多个单选框时，都指定name为一个，单选时只会选择其中某一个;
male:<input type="radio" name='hello'>
# 里面有value值时，会通过GET方法传递给服务端，但必须嵌套在<form>标签里面;
male:<input type="radio" name='hello' value='1'>

单选框项目实战 

<div>
    <form>
        <p>select gender:</p>
        male:<input type="radio" name="gender" value="1">
        female:<input type="radio" name="gender" value="2">
        <input type="submit" value="submit">
    </form>
</div>

复选框 

# 多个复选框可以批量获取多个数据,在后台以列表的格式保存;
<input type='checkbox' name='fav' value='1'>

# 设置复选框的默认值
<input type='checkbox' name='fav' value='1' checked='checked'>
或者
<input type='checkbox' name='fav' value='1' checked>

复选框实例 

<div>
    <form>
     <p>hobbies</p>
            singing:<input type="checkbox" name="fav" value="1">
            dancing:<input type="checkbox" name="fav" value="2">
            running:<input type="checkbox" name="fav" value="3">
            <p>skills</p>
            TopCoder:<input type="checkbox" name="skill" value="1" >
            Shoot<input type="checkbox" name="skill" value="2">
            <br/>
            <input type="submit" value="submit">
        </form>
</div>

上传文件 

      # 此处指定名称，是为了提交到后台，对文件进行处理的

<input type='file' name='fname'>

上传文件实例 

<div>
    # 此时上传文件并不会成功，因为它依赖form表单的一个属性enctype;
    # 表示把要上传的文件一点一点发送到服务端;
    <form enctype="multipart/form-data">
        <input type="file" name="fname">
        <br/>
        <input type="submit" value="submit">
    </form>
</div>

重置表单

# 取消表单中新填写的内容
<input type="reset" value="reset">

5.body-background

.tabs {
margin:40px;<!-- 上边距-->
padding-left:100px;<!-- 左边距-->
}
    <div class="tabs">
    <div class="tabs_item">
        <div class="list_item">JAVA</div>
        <div class="list_item">DreamWeaver</div>
        <div class="list_item">HBuilder</div>
        <div class="list_item">Linux</div>
        <div class="list_item">Asp.net</div>
    </div>

//页面背景平铺
 body{
        background:url(jpg/6.jpg)no-repeat;    
        idth:100%;
        height:100%;
        background-size:cover;
      }