`

CSS+DIV+HTML杂(二)

阅读更多

一、表格:
<table></table>表格标签的属性:
cellspacing:间距:单元格与单元格的距离(单元格间隔大小)
cellpadding:填充:文本与单元格的距离,也就是内边距的意思(单元格边框与其内容大小)
bgcolor设置表格的背景色
border设置边框宽度
bordercolorlight 设置边框明亮部分的颜色(当border的值大于1时才能使用)
bordercolordark  设置边框昏暗部分的颜色(当border的值大于1时才能使用)
<tr><td>都有valign属性它用于设置单元格垂直对齐方式
valign的取值可以为top(顶端对齐),middle(居中间对齐)或bottom(底端对齐)
colspan设置单元格跨占的列数(默认值为1)
rowspan设置单元格跨占的行数(默认值为1)
nowrap="nowrap"静止对单元格中过程的内容自动换行.(会使单元格自动拉长)
<th>标签的用法和<td>的用法完全一样,它显示的效果通常是黑体居中文字(一般用做表头)
<caption></caption>标签指定表格的标题
<table border=1>
<caption></caption>
<tr>
<th></th>
</tr>
<tr>
<td></td>
</tr>
<table>

 

二、多媒体:
<embed src="Modern C#系列课程(1):应用程序的执行 .wmv" autostart="false"></embed>
(可以插入视频:如flash,wav等等)
DW中的使用:插入-->媒体-->插件
autostart=true代表自动开始播放
反之则不自动播放

 

三、框架标签:(在一个页里显示几个不同的网页)注意:框架是放在</head>和</body>之间的
<frameset rows="80,*" cols="*" frameborder="no" border="0" framespacing="0" frameborder="yes">
  <frame src="top.html" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" title="topFrame" />分成两块后在上面这块放入一个frame
  <frameset cols="80,*" frameborder="no" border="0" framespacing="0">在下面这块放入一个frameset再次把它分成左右两块按列分
    <frame src="left.html" name="leftFrame" scrolling="No" noresize="noresize" id="leftFrame" title="leftFrame" />
    <frame src="main.html" name="mainFrame" id="mainFrame" title="mainFrame" />
  </frameset>
</frameset>
rows属性代表该框架行分成上下两块80像素和剩下的全部*代表全部
cols属性代表把框架列分成左右两块80像素和剩下的全部*代表全部
frameboder="no"代表框架无边框
border边框粗细
framespacing代表框架间距
noresize
frameborder="yes"代表该框架是否有有边框
noresize="noresize"假如一个框架有可见边框,用户可以拖动边框来改变它的大小。如果不想让用户改变大小,可以在<frame>标签中加入:noresize="noresize".
scrolling用来指定是否在帧窗口边框上显示滚动条,取值可是是yes(显示),no(不显示)或auto(网页内容的空间比帧窗口大时显示,否则自动不显示)

<noframes></noframes>
该标签也是放在<frameset></frameset>标签之间,用来对那些不支持帧(框架)的浏览器中显示文本或图像信息.
示例:
<html>
<head>
<title></title>
</hrad>
<frameset rows="80,*" cols="*" frameborder="no" border="0" framespacing="0" frameborder="yes">
  <frame src="top.html" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" title="topFrame" />分成两块后在上面这块放入一个frame
  <frameset cols="80,*" frameborder="no" border="0" framespacing="0">在下面这块放入一个frameset再次把它分成左右两块按列分
    <frame src="left.html" name="leftFrame" scrolling="No" noresize="noresize" id="leftFrame" title="leftFrame" />
    <frame src="main.html" name="mainFrame" id="mainFrame" title="mainFrame" />
  </frameset>
<noframes>
<body>
<p>对不起,你的浏览器不支持"框架"!</p>
</body>
</noframes>
</frameset>
</html>

<iframe></iframe>
该标签不需要放在<frameset></frameset>标签对之间,它的作用是在一个网页中间插入一个简单的帧窗口,在这个帧窗口中可以显示另一个文件,
这就能够实现一种"画中画"的效果,<iframe>标签中的文本只有在浏览器不支持<iframe>标签是才会显示,以提示用户的浏览器不支持<iframe>标签的信息
<iframe src="b.html" frameborder="0"></iframe>
src属性代表嵌套到这个帧窗口(框架窗口)的页面路径
frameborder代表这个帧窗口的边框,0代表无.访问者看不出内嵌了一个帧窗口.
还可以通过超链接方式点击进入帧窗口如:
<iframe src="b.html" frameborder="0" name="iframe"></iframe>
<a href="http://www.jhxk.iteye.com" target="iframe">请点击</a>
这里的traget的值是帧窗口的name.


比如在left.html里又个超连接<a href="http://www.163.com" target="mainFrame">163</a> target属性指定在mainFrame这个<frame>(frame标签也叫帧标签)窗口中显示该网页
target属性的值:
_blank:当单击这个超链接时,浏览器会打开一个新窗口显示超链接目标网页
_self:浏览器将在超链接源网页窗口中显示超链接目标网页,这个值是超链接是默认值(当前窗口中显示目标网页)
_parent:当前帧的直接父帧窗口,(先前页面是什么方式打开网页就继承字先前页面的方式)
_top:表示在最顶层的窗口中显示目标网页.


四:下拉框
<select size="3">
<option value="浙江省">浙江省</option>
<option value="江苏省">江苏省</option>
<option value="河南省">河南省</option>
</select>
该标签指定size属性大小就会变成列表框
不加size属性是普通的下拉框
<select>标签还有一个multiple="multiple"属性,这是一个不用赋值的属性
直接加入标签即可,加入了此属性后,访问者可以在这列表框选择多个选项
在选择多个选项时要按住Ctrl键
<option>来包含显示各个条目文本
<option>属性:
value:单击某个选择做出选择后,这个选项的value属性值与<select>标签的name属性值一起传送给www服务器
注意:如果没有value属性那么浏览器将把选项的显示文本(在起始和结束选项标签<option></option>之间的内容)
发送给www服务器
selected:指定浏览器在首次显示列表框或通过<reset>按钮重置表单时,列表框自动选中该选项(默认选择项selected="selected")


五:单选框
男<input type="radio" checked="checked" name="sex" id="sex"/>
女<input type="radio" name="sex" id="sex"/>
checked="checked"代表默认选中该单选框


六:文本域
<textarea name="content" cols="35" rows="8" id="content"></textarea>
cols代表列数
rows代表行数


七:附件
<input type="file" name="file" />
用户可以直接在文本输入框中输入本地的文件路径名.也可以通过浏览设置
注意:要上传文件的表单<form>标签的enctype属性必须设置为"multipart"/form-data",
并且method属性必须是POST

八:隐藏表单域
<input type="hidden" name="hidden" />


九:背景音乐标签:
<bgsound></bgsound>
<bgsound src="sound/adcc-p.mp3" loop="-1">
loop属性等于-1代表无限循环(循环播放)
loop属性等于1代表播放一次


十:<form></form>
在这个标签对之间需要嵌入各类表单字段元素(如:文本输入框,列表框等)
才有意义,一个表单能够向www(Web)服务器传递多个信息,每个信息都需要有一个名称
来标识,这些信息由表单字段元素来产生,这里说的表单字段元素就是指表单相关的标签
<input>开头的标签,因此嵌套在<form>标签中的每个表单字段元素,都应又一个name属性
这样,www服务器才能依据这些名称,了解到传递给它的每个值分别是由哪个表单字段元素产生的.
没有指定name属性的表单字段元素的数据不会被传递给www服务器程序.
<form>标签的属性:
(1):action属性:
用来设置接收和处理浏览器递交表单内容服务器的URL
例如:<form action="http://www.jhxk.iteye.com">
当然一般自己开发是用相对路径的:<form action="tt.jsp">
(2):title属性:
鼠标移动到表单范围内会又文字提示
(3):enctype属性
指定那个浏览器使用那种编码方法将表单数据传递给www服务器
默认设置为:application/x-www-form-urlencoded也就是
浏览器在提交表单数据时会先自动对表单字段元素值中的特殊字符
作URL编码处理,然后再将编码后的数据传递给www服务器。
一般情况下没必要修改这个属性的设置.
注意:要上传文件的表单<form>标签的enctype属性必须设置为"multipart"/form-data",
并且method属性必须是POST


十一:<input type="text">
属性:
size:指定文本输入区域的宽度,以字符个数为度量单位
value:指定浏览器在第一次显示表单时或单击<input type="reset">按钮后,显示在输入区域中的文本内容
maxlength:指定用户能够输入的最大字符串长度.
readonly="readonly"(只读的)属性存在时,文本输入区域不能获得焦点,访问者也不能改变文本输入区中的值.
disabled="disabled"(禁用的)文本输入区域不能获得焦点,访问者也不能改变文本输入区中的值,并且表单提交
时,浏览器不会将文本输入区域的名字和值发送给www(web)服务器.
注意:用户没有在单行文本输入区域输入数据,那么在表单提交时,浏览器也会把这个单行输入区域的名称(由name属性指定)
作为一个参数名,传递给服务器,只是这是一个无值的参数,如:"user="这样.

十二:<input type="image">
用于在表单上创建一个图像元素,图像的源文件名由src属性指定,
它没有value属性.
注意:图像元素可以submit按钮

分享到:
评论

相关推荐

    后台模板 css+div+html

    后台模板 css+div+html后台模板 css+div+html后台模板 css+div+html后台模板 css+div+html后台模板 css+div+html后台模板 css+div+html后台模板 css+div+html后台模板 css+div+html后台模板 css+div+html后台模板 ...

    html+div+css+js学习.zip

    html+div+css+js学习html+div+css+js学习html+div+css+js学习 html+div+css+js学习html+div+css+js学习html+div+css+js学习 html+div+css+js学习html+div+css+js学习html+div+css+js学习 html+div+css+js学习...

    十步学会用css+div建站

    培训资料CSS+div建站基本教程,PPT格式. 培训资料CSS+div建站基本教程,PPT格式.

    CSS+DIV光盘程序

    CSS+DIV光盘程序CSS+DIV光盘程序CSS+DIV光盘程序CSS+DIV光盘程序CSS+DIV光盘程序

    精通CSS+DIV网页样式与布局

    精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局....

    用CSS+DIV做的网上书店模板

    CSS+DIV 布局 主要是一个网上书店的模板 精美布局 只要想的到 就能做得到

    CSS+DIV布局案例CSS+DIV布局案例CSS+DIV布局案例

    CSS+DIV布局案例CSS+DIV布局案例CSS+DIV布局案例CSS+DIV布局案例

    CSS+div教程,CSS+div教程

    CSS+div教程CSS+div教程CSS+div教程CSS+div教程CSS+div教程

    jsp css+div 后台框架

    jsp css+div 后台框架 jsp css+div 后台框架 jsp css+div 后台框架 jsp css+div 后台框架 比较完美的后台框架

    css+div网页模板整站

    别人分享的资料,我只是拿出来和大家分享一下,希望能给做网页的朋友一点帮助。如果拿这资源做坏事,与我无关。

    CSS+DIV 20个经典实例(上)

    CSS+DIV 20个经典实例(上)CSS+DIV 20个经典实例(上)CSS+DIV 20个经典实例(上)CSS+DIV 20个经典实例(上)CSS+DIV 20个经典实例(上)CSS+DIV 20个经典实例(上)CSS+DIV 20个经典实例(上)

    网页设计-页面布局篇(Css+Div)

    网页设计-页面布局篇(Css+Div),网页设计-页面布局篇(Css+Div).网页设计-页面布局篇(Css+Div).网页设计-页面布局篇(Css+Div).

    精通css+div

    精通css+div 1,2,8,9,10章

    HTML+CSS+DIV网页设计与布局.pdf

    以html语言为基础,围绕最新的css技术精髓展开深入讲解,包括认识网站开发、网页文字和图片、超链接、表格、多媒体、滚动字幕、列表、表单、框架、设置文本样式、设置网页背景样式、设置边框边距、元素布局、网页...

    div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格

    div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格 百分比表格(用DIV+CSS)以百分比显示,可以根据窗口的大小自动调节所显示的大小! DIV+CSS+JS静态分页程序可兼容主流浏览器(IE、FF、Opera) DIV+CSS表格...

    精通css+div 网页样式与布局 ppt文件

    正在学习css+div的朋友应该都知道这几本书吧,《精通css+div 网页样式与布局》还有《css设计彻底研究》这些书都非常好,现在将《精通css+div 网页样式与布局》的ppt文件传上来,这样大家就可以不用买实体书了,至于...

    CSS+DIV流畅的选项卡

    CSS+DIV流畅的选项卡 CSS+DIV流畅的选项卡 CSS+DIV流畅的选项卡

    《精通CSS+DIV网页样式与布局》光盘源码

     第12章 CSS+div美化与布局实战   12.1 框架搭建   12.2 实例一:蓝色经典   12.3 实例二:清明上河图   12.4 实例三:交河故城   12.5 自动选择CSS样式  第3部分 CSS混合应用技术篇  第13章 ...

    div +cssdiv +cssdiv +cssdiv +cssdiv +cssdiv +css

    div +cssdiv +cssdiv +cssdiv +cssdiv +cssdiv +cssdiv +cssdiv +cssdiv +cssdiv +css

    漂亮遮罩层css+div

    漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div 漂亮遮罩层css+div ...

Global site tag (gtag.js) - Google Analytics