html与css课件,HTML与CSS讲解.ppt

HTML与CSS讲解

3.1 静态网页HTML简介 3.2 Dreamweaver 3.3 HTML的常用标记 3.4 表单设计 3.5 框架式网页 3.6 层叠样式表CSS 表单的提交方式get和post两种方式的区别 表单的提交方式有get和post两种方式 : 简单来说： post传递数据量较大，较安全，用request.form(“”)取值。 get传递数据量较小，没有post安全性强，用request.querystring("取值") 。 表单的提交方式get和post两种方式的区别 就Java来看有三点重要的区别： 1、服务器端获取数据的方式不同。 post方式传递的数据，必须用request.form("")获取。 get方式传递的数据，必须用request.querystring("")获取。 注意：虽然两种提交方式可以统一用Request(“”)来获取提交数据， 但是这样对程序效率有影响，不推荐使用。 表单的提交方式get和post两种方式的区别 就Java来看有三点重要的区别： 2、post比get安全性较强。 在客户端，Get方式在通过URL提交数据，提交后在地址栏中的地址；Post提交后地栏不变; 比如说在登陆表单中用Get方式，用户输入的用户名和密码将在地址栏中暴露无遗。如果：登陆页面可以被浏览器缓存；其他人可以访问客户的这台机器。那么，别人即可以从浏览器的历史记录中，读取到此客户的账号和密码。 所以，在某些情况下，get方法会带来严重的安全性问题。在Form中，建议使用post 表单的提交方式get和post两种方式的区别 就Java来看有三点重要的区别： 3、post比get传递数据量大。 复选框有下列可设定的属性： value：设定该控件的内容、值或是意义。 checked：是设定该控件为预设选取值。 示例 文本域的属性： wrap：设定该控件的换行模式。设定值有三种：OFF(输入文字不会自动换行)、VIRTUAL(输入文字在屏幕上会自动换行，不过若是使用者没有自行按下ENTER换行，送出资料时，也视为没有换行)、PHYSICAL(输入文字会自动换行，送出资料时，会将屏幕上的自动换行，视为换行效果送出)。 cols：设定该控件的行数(横向字数)。 rows：设定该控件的列数(垂直字数)。 示例 下拉选择框的属性： size：该属性与其它表单控件的size属性不同，默认值为1，此时显示的样式就是一个标准的下拉框；如果size的属性值大于1，那么下拉框就会变成“列表框”的样式。 multiple：表示能够多选，不增加此属性默认只能单选。 value：定义选择项的值。 selected：表示默认已选择本选项。 3.4.9 按钮 通常用户窗体填完之后，都会有一个提交按钮和一个重置按钮，对应的type属性值分别为“submit”和“reset”。提交按钮可以直接把用户在

中所有表单控件上填写或选中的值提交给服务器；而重置按钮则是使中所有的表单控件恢复默认值。 除了这两种具有特殊功能的按钮之外，还有一种普通类型的按钮，type属性值为“button”，普通类型的按钮通常可以根据设计者的需求自定义它的功能，这就需要JavaScript脚本对其进行控制，后续章节会做详细介绍。 示例 3.5 框架式网页 在一个网页中，并不需要所有的内容都在单击链接的时候改变，比如导航条、站点标志、版权信息等，都是不需要改变的。因此我们没有必要在每一个网页中都插入这些元素，这不但能减轻设计制作网页的工作量，也可以减少用户浏览时由浏览器检测这些元素是否已经被装载过的时间。框架主要的作用就是将窗口划分为几个“区域”，然后根据需要在某些区域放置不需要改变的元素，某些区域放置需要改变的内容。 左侧是菜单(导航条)，无论单击任何一个商品类别的时候，它都不会也不需要改变，唯一需要改变的是由右侧最大的区域，它根据我们单击的商品类别的不同而显示不同的页面内容。 3.6.1 CSS应用形式 3.6.2 CSS选择符 给样式起名 要在页面中使用CSS，需要先定义CSS样式，如：.main {font-size:16pt;}，其中main在CSS中称为选择符，选择符可以认为是一个CSS样式的名称。 那么要使用这个定义好的样式，只需要在调用的地方加上class=“main”的语句即可，如 CSS样式，引用该样式后，被引用的元素字体大小就被固定为16pt。 CSS的选择符 CSS的选择符主要有以下4种： 1．对HTML基本元素的重新定义。 2．自定义的选择符。 3．第三类是对第一类的深入扩展，是对HTML中某个元素的下级元素直接进行样式的修改。 4．第