双飞翼页面布局与网页表单的制作

Posted 2020-10-22 lzl1978

• 双飞翼布局
• 基本的页面布局
• 首先建立三个块级元素，全部设定高度，中间的块级元素按照显示屏幕的宽度百分百设定，左右两个块级元素设定相同的宽度。
• 其次将三个块级元素依次设定漂浮效果，通过设置外框边距（margin属性）使三个块级元素在同一行显示。使得网页被分为左中右三部分。
• 网页表单制作
• 常用到的标签（青岛教学网为例）
• form标签 表单的内容都被包含在这个标签里面，用于向后端传输数据。有三个属性，method:以何种方式提交，增，删，改，查四个方法。action:表单提交的地址。name???
• table标签 表单的所有元素都在这个标签之间编写代码
• input标签 输入文本内容时，用到这个标签，常见的就是文本输入框，placeholder属性可以使得文本框里有可以看见的隐形提示文字
• select标签 显示下拉箭头框栏，配合option标签使用
• option标签 配合select标签使用，下拉箭头框栏内可以选择的项目都由这个标签编写
• checkbox标签 复选框的做成，要用到这个标签
• radio标签 单选框的做成，要用到这个标签
• a标签 用于链接的做成
• nav标签 配合a标签使用，表头的导航链接栏
• image标签 配合a标签使用，点击图像时可以自动链接到相关的网页
• border-collapse:collapse的属性，用于将表单外部框线和内部元素的边框线重叠在一起。border-collapse:seperate属性，外部框线和内部元素边框分离
• 网页表单制作时应考虑的主要事项
• 应该事先对要做成的表单各项目元素进行分析，统一分成几个大的项目，便于在css里进行统一样式设定
• 尽可能对表单几个重要的部分都做好注释，以便日后进行修改，查询

1. 关于表单做成的几个问题

• checkbox的复选框的形状设定 背景颜色
• 表单代码里编写的required属性的意思