大一寒假周报（二）--淘宝页面制作与表单复习

基本结构样式

结构划分（可以按照颜色尺寸来划分）

-头部信息
-广告区
-搜索区
-主卖场
-侧边栏等特殊区域（最好使用id选择器）

准备样式表

-准备重置样式表
-自己的样式表

头部信息样式

标题

使用标题来实现

小图标

-格式：.ico
可以在网页上制作，注意要放在网页的根目录中

<link rel="icon" href="favicon.ico">

注意IE浏览器不能通过私有协议来打开图标

base标签

设置一个基础的url，或者是跳转。注意一个页面只能有一个base标签。

列表

子元素浮动起来，父元素清除浮动

表单元素简单复习（主要用于收集用户数据）

input元素

输入框
type属性：表示输入框类型

-date：日期选择框
-password：密码框
-text：文本框
-sreach：搜索框
-color:颜色选择框
-checkbox：多选框
-radio：单选框（要加入name来分组）
-fail：文件选择框

value属性：输入框的默认值

placeholder属性：提示内容，文本框没有内容时显示

select元素

下拉元素选择框，子元素只能是option和optgroup

textarea元素（文本域、多行文本框）

<textarea name="" id="" cols="30" rows="10"></textarea>

button按钮元素

type属性：reset、button、submit、默认值submit

表单状态

readonly属性：表示只读，不会改变表单显示样式

disabled属性：是否禁用，会改变表单显示样式，表示不能点击

配合表单元素的其他元素

label

-显示关联：for属性属性值是表单元素的id属性，把标签和表单元素关联
-隐式关联：将表单元素直接放进label中

datalist（数据列表）

该元素本身不会显示到页面，通常用于和普通文本的配合

    <P>
        请输入常用的浏览器：
        <input list="useragent" type="text">
    </P>
    <datalist id="useragent">
        <option value="1">1</option>
        <option value="1">2</option>
        <option value="1">3</option>
        <option value="1">4</option>
        <option value="1">5</option>
        <option value="1">6</option>
    </datalist>