发表于： 2020-03-20 09:03:50
1 1147
今天完成的事情：完成任务4.
明天计划的事情：完成任务5.
遇到的问题：
收获：
1、position属性。
position属性定义元素的定位方法。属性只有：
static，默认值为static。表示没有定位，元素按照正常的文档流显示。
relative，相对定位。生成相对定位的元素，相对于其正常位置进行定位。
absolute，绝对定位，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
fixed，固定定位。生成固定定位的元素，相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。
2、z-index属性。
z-index 属性指定一个元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。z-index 仅能在定位position元素上奏效。
3、表单元素。
表单是一个包含表单元素的区域。
表单元素是允许用户在表单中输入内容,比如：文本域(textarea)、下拉列表、单选框(radio-buttons)、复选框(checkboxes)等等。
表单使用表单标签 <form> 来设置。
表单种类：
文本框： 文本框是一种让访问者自己输入内容的表单对象，通常被用来填写信息或者简短的回答，如姓名、地址等。
代码格式：<input type="text" name="..." size="..." maxlength="..." value="..."
属性解释：
type="text"定义单行文本输入框；
name属性定义文本框的名称，要保证数据的准确采集，必须定义一个独一无二的名称；
size属性定义文本框的宽度，单位是单个字符宽度；
maxlength属性定义最多输入的字符数。
value属性定义文本框的初始值
多行文本框：一种让访问者自己输入内容的表单对象，只不过能让访问者填写较长的内容。
代码格式：<textarea name="..." cols="..." rows="..." wrap="VIRTUAL"></textarea>
属性解释：
name属性定义多行文本框的名称，要保证数据的准确采集，必须定义一个独一无二的名称；
cols属性定义多行文本框的宽度，单位是单个字符宽度；
rows属性定义多行文本框的高度，单位是单个字符宽度；
wrap属性定义输入内容大于文本域时显示的方式
密码框: 是一种特殊的文本域，用于输入密码。当访问者输入文字时，文字会被星号或其它符号代替，而输入的文字会被隐藏。
代码格式：<input type="password" name="..." size="..." maxlength="...">
属性解释：
type="password"定义密码框；
name属性定义密码框的名称，要保证数据的准确采集，必须定义一个独一无二的名称；
size属性定义密码框的宽度，单位是单个字符宽度；
maxlength属性定义最多输入的字符数。
单选框: 当需要访问者在单选项中选择唯一的答案时，就需要用到单选框了。
代码格式：<input type="radio" name="..." value="...">
属性解释：
type="radio"定义单选框；
name属性定义单选框的名称，要保证数据的准确采集，单选框都是以组为单位使用的，在同一组中的单选项都必须用同一个名称；
value属性定义单选框的值，在同一组中，它们的域值必须是不同的。
复选框: 复选框允许在待选项中选中一项以上的选项。每个复选框都是一个独立的元素，都必须有一个唯一的名称。
代码格式：<input type="checkbox" name="..." value="...">
属性解释：
type="checkbox"定义复选框；
name属性定义复选框的名称，要保证数据的准确采集，必须定义一个独一无二的名称；
value属性定义复选框的值
提交按钮: 提交按钮用来将输入的信息提交到服务器。
代码格式：<input type="submit" name="..." value="...">
属性解释：
type="submit"定义提交按钮；
name属性定义提交按钮的名称；
value属性定义按钮的显示文字；
下拉列表：下拉列表使用户可以点击后再下拉的选项中点击选择。
代码格式：
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat" selected>Fiat</option>
<option value="audi">Audi</option>
</select>
返回列表
评论