Form表单控件与浮动

Form表单控件

第一点：
文本域
textarea
语法
属性
name：控件的名字
cols：指定文本域的列数，变相设置宽度
rows：指定文本域的行数，变相设置高度
readonly：只读
placeholder：提示语句
第二点：
选项框
两个部分
下拉选项框 滚动列表
语法：
创建下拉列表
创建滚动列表
属性：
select：
name：控件的名字
size：设置默认显得选项数量 如果取值大于1的话则为滚动列表
multiple：形成滚动效果 多选
option：
sekected：默认项
第三点：
button元素
语法：

 <button></button>

注意： button 放在form表单里面那么就是个提交按钮
放在之外就是一个普通按钮
ps：button中间是可以放置图片
input控件也可以使用图片 type为image 也是提交的作用
第四点：
浮动框架
作用：可以在一个浏览器窗口中同时显示多个页面文档
语法：

内容 注意：必须是成对的标记 当浏览器不支持的时候 将显示标签中间的内容

属性：
src：网页url 可以自己的html页面也可以是网上的页面
width：宽度
height：高度
frameborder：浮动框架的边框
第五点：
摘要和细节
作用：允许将页面某部分内容进行展示或者收缩
语法：
第一步：定义一个摘要

 <details></details>

第二步：确认标题

 <summary></summary>

第三步：写内容

代码块

<div id="top" style="border: 1px solid #ccc; font-size:10px;width:930px; margin: auto;">
  <p align="center" style="margin-top: -10px;"><img src="img/lol.png" alt="" / width="930px"></p>
     <h1>英雄联盟</h1>
     <p>《英雄联盟》（简称lol）是由美国Riot Games开发，腾讯游戏运营的英雄对战网游。《英雄联盟》除了即时战略、团队作战外，还拥有特色英雄、自动匹配的网站平台，包括天赋树、召唤师系统、符文等元素。</p>
     <table>
      <tr>
       <td>中文网</td>
       <td>英雄联盟</td>
       <td>发行商</td>
       <td>腾讯游戏</td>
      </tr>
      <tr>
       <td>其他名称</td>
       <td>撸啊撸、lol</td>
       <td>发行日期</td>
       <td>2011年9月22日</td>
      </tr>
      <tr>
       <td>游戏类型</td>
       <td>策略、角色扮演、竞技、团队合作</td>
       <td>玩家人数</td>
       <td>多人</td>
      </tr>
      <tr>
       <td>游戏平台</td>
       <td>PC</td>
       <td>游戏画面</td>
       <td>3D</td>
      </tr>
     </table>
     <h2>目录</h2>
     <ol>
      <li>
       <a href="#">游戏背景</a>
      <ul>
       <li>战争学院</li>
       <li>德玛西亚</li>
      </ul>
      </li>
      <li>
       <a href="#">游戏系统</a>
      <ul>
       <li>天赋系统</li>
       <li>符文系统</li>
      </ul>
      </li>
     </ol>

实现结果