html第二讲

html第二讲

列表

• 无序列表

  <ul type="circle">
      <li>1</li>
      <li>2</li>
  </ul>
  
  type属性：
  """
  disc   实心圆点，默认值
  circle 空心圆圈
  square 实心方块
  none   无样式
  """
  

• 有序列表

  <ol type="1" start="2">
    <li>第一项</li>
    <li>第二项</li>
  </ol>
  
  type属性
  """
  1 数字列表，默认值
  A 大写字母
  a 小写字母
  Ⅰ大写罗马
  ⅰ小写罗马
  """
  

• 标题列表

  <dl>
    <dt>标题1</dt>
    <dd>内容1</dd>
    <dt>标题2</dt>
    <dd>内容1</dd>
    <dd>内容2</dd>
  </dl>
  

表格

<table>
    <thead>                               # 书写表头
        <tr>                              # 代表一行
            <th></th>                     
            <th></th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr>                              # 书写内容
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </tbody>
</table>


属性：
"""
border: 表格边框
cellpadding: 内边距
cellspacing：外边距
width：宽
rowspan: 单元格竖跨多少行
colspan: 单元格横跨多少列(合并单元格)
"""

表单

<form action="" method="post" enctype="">
    <p>
      username:  <input type="text" value="egon" readonly name="username" placeholder="用户名">
    </p>
   <p>
     password:   <input type="password" name="password">
   </p>
    <p>
        <input type="date" name="date">
    </p>
    <p>
        <input type="radio" name="gender" value="1">男
        <input type="radio" name="gender" value="2" checked>女
        <input type="radio" name="gender" value="3">其他
        <input type="radio" name="gender" value="4">爱好
    </p>
    <p>
        <select name="province" id="">
            <option value="1">上海</option>
            <option value="2">北京</option>
            <option value="3">东京</option>
            <option value="4" selected>西京</option>
        </select>
    </p>
    <p>
        <input type="file" name="myfile">
    </p>
    <p>
        <input type="checkbox" name="hobby" value="1" checked>篮球
        <input type="checkbox" name="hobby" value="2">足球
        <input type="checkbox" name="hobby" value="3" checked>排球
    </p>
    <p>
        <textarea name="" id="" cols="50" rows="10" >
            dadasdas
        </textarea>
    </p>

    <p>
        <input type="hidden" value="1">
    </p>
    
<!--    提交表单的两种方式


-->
    <p>
        <input type="submit">
    </p>
<!--    button按钮要想提交表单，必须写在form中-->
    <button>登录</button>
    <input type="reset">
</form>


属性：
"""
action: 
	1.什么都不写，意味着朝当前地址提交
	2.写全路径
	3.写一个路由，会自动给你拼接ip和port
	
method:
	get
	post
"""
enctype：默认是urlencode  不能上传文件
formdata可以上传文件，，不能指定json，，json用ajax活着第三方插件

input

text: 单行文本框
password: 密码框
date：日期框
checkbox：复选框
radio：单选框
submit：提交按钮
reset： 重置按钮
button：普通按钮
hidden：隐藏输入框
file：  文本选择框
select: 下拉列表框
textarea:多行文本

"""
name: 表单提交时的健
value:
	type=button, resert, submit时为按钮上显示的文本内容
	type=text, password, hidden时，为输入框的默认值
	type=checkbox,radio,file  为输入相关联的值
checked:radio和checkbox默认被选中的项
readonly:text和password设置只读
disabled: 所有的input均适用
placeholder： 输入框的提示信息

select属性：
	multiple：布尔属性，设置后为多选，否则默认单选
    disabled：禁用
    selected：默认选中该项
    value：定义提交时的选项值
"""