网页设计第5节课

3.10 表单 3.10.1 表单标记表单的基本语法及格式为：

3.10.2 文字和密码的输入使用 <input> 标记的 type 属性，可以在表单中加入表项，并控制表项的风格。 type 属性值为 text ，则输入的文本以标准的字符显示； type 属性值为 password ，则输入的文本显示为“●”。【例 3-30 】 3.10.3 重置和提交格式为： <input type="reset" value=" 按钮名 " /> <input type="submit" value=" 按钮名 " /> 默认情况下，重置和提交的按钮分别显示为“重置”和“提交查询内容”。 3.10.4 复选框和单选钮用 <input> 标记的 type 属性可设置选择钮的类型属性 value 可设置该选择钮的控制初值，用以告诉表单制作者选择结果。用 checked="checked" 表示是否为默认选项。 name 是该控件的惟一标识，同一组复选框或单选钮的名称是一样的。【例 3-31 】

3.10.5 选择栏 <select> 标记的格式为： <select size="x" name=" 选择栏名 " multiple="multiple"> <option value=" 选项值 "> 选项说明 </option> <option selected="selected" value=" 选项值 "> 选项说明 </option> … </select> 【例 3-32 】 3.10.6 多行文本框格式为： <textarea name=" 多行文本框名 " rows=" 行数 " cols=" 列数 "> 多行文本 </textarea> 其中的行数和列数是指不用滚动条就可看到的部分。

第 4 章网页表现语言—— CSS CSS 是 Cascading Style Sheets （层叠样式单）的简称，更多的人把它称作样式单。 4.1 CSS 简介引入 CSS 的目的就是把结构与样式分离，网页的结构用 XHTML 的标记定义，网页的外观样式用 CSS 定义。当多个网页采用相同的外观样式时，只要建立一个定义样式的 CSS 文件，让 XHTML 调用这个 CSS 文件所定义的样式即可。

4.2 把样式加到网页中的方法当浏览器读取样式单时，要依照文本格式来读，可以使用 4 种方法把样式单加入到网页中：行内样式、内嵌一个样式单、链接到一个外部的样式单文件和导入多个外部样式单文件。

4.2.1 行内样式 < 标记 style=" 属性 : 属性值 ; 属性 : 属性值 ..."> 【例 4-1 】 4.2.2 内嵌一个样式单 <head> ... <style type="text/css">  </style> ... </head>

除了在 <style>...</style> 内分别定义各种选择符的样式外，如果多个选择符具有相同的样式，可以采用组合选择符，以减少重复定义的麻烦。其格式为： <head> ... <style type="text/css">  </style> ... </head> 【例 4-2 】【例 4-3 】

4.2.3 链接到一个外部样式单文件格式为： <head> ... <link rel="stylesheet" href=" 样式单文件名 .css" type="text/css" /> ... </head> 样式单文件的格式为：选择符 1{ 属性 : 属性值 ; 属性 : 属性值 ; ... } /* 注释内容 */ 选择符 2{ 属性 : 属性值 ; 属性 : 属性值 ; ... } ... 选择符 n{ 属性 : 属性值 ; 属性 : 属性值 ; ... } 【例 4-4 】

4.2.4 导入多个外部样式单文件导入外部样式单文件是指在嵌入样式单的 <style>...</style> 中插入多个外部样式单文件。其格式为： <head> ... <style type="text/css">  </style> ... </head> 【例 4-5 】

4.3 新增加的 HTML 扩充标记和属性 4.3.1 class 与 id 属性 1. class 属性定义带有类选择符的样式说明的格式为：元素名 . 类选择符名 { 属性 : 属性值 ; 属性 : 属性值 ... } 还有一种用法，在选择符中省略 XHTML“ 元素名”名，可以把几个不同的元素定义成相同的样式。其格式为： . 类选择符名 { 属性 : 属性值 ; 属性 : 属性值 ... } 或者 *. 类选择符名 { 属性 : 属性值 ; 属性 : 属性值 ... } 【例 4-6 】 2. id 属性用 id 选择符定义样式的格式为： #id 选择符名 { 属性 : 属性值 ; 属性 : 属性值 ... } “ id 选择符名”就是元素的 id 标识，由网页设计者定义。【例 4-7 】

4.3.2 <div> 与 <span> 定位标记 HTML 的文档结构分为两大类：块级结构与行级结构。在 HTML 中有 div 和 span 两个标记。 1. <div> 标记 <div> 标记的格式为： <div id=" 样式名 " align="left|center|right"> 文本、图像或表格等 </div> <div class=" 样式名 " align="left|center|right"> 文本、图像或表格等 </div> 【例 4-8 】 2 ． <span> 标记 <span> 的格式为： <span id=" 样式名 ">...</span> <span class=" 样式名 ">...</span> 【例 4-9 】

网页设计第5节课

by ecmoment on Nov 17, 2010

Accessibility

Categories

Upload Details

Usage Rights

1 Embed 122

Statistics

网页设计第5节课 — Presentation Transcript