一:<label>标签
如果想通使用普通windows程序一样,可以用快捷键在表单字符元素之间进行切换,
选中或清除复选框,选择单选按钮,这久需要使用<label></label>标签来实现这种功能了
如:
<form>
<label for="usr" accesskey="a">用户名(<u>a</u>):</label>
<input type="text" name="user" id="usr" /><br />
<label for="pas" accesskey="b">密码(<u>b</u>)</label>
<input type="password" name="pass" id="pas" /><br />
<label for="male" accesskey="c">男(<u>c</u>)</label>
<input type="radio" name="sex" id="male"/>
<label for="female" accesskey="d">女(<u>d</u>)</label>
<input type="radio" name="sex" id="female" /><br />
<label for="mar" accesskey="e">婚姻状况</label>
<input type="checkbox" id="mar" name="married" />
</form>
依次按下Alt+A键、Alt+B键、Alt+C键、Alt+D键、Alt+D键就能看到快捷键的作用了.
for属性:指定快捷键将作用于的保单字段元素,设置值必须与某个表单字段元素的id值相吻合.
accesskey属性,指定for属性所对应的表单字段元素的快捷键,使用快捷键必须按下alt+快捷键
二:头元素
头元素是指通常位于<head></head>标签对之间的元素,包括title,base,link,meta等
这些元素可用来表明网页文件的有关信息,例如,文档标题,搜索引擎针对当前网页文档所
收入的关键字内容和其他一些不属于文档内容的信息.以下都是头元素.
(1):<base></base>
该标签用于指定网页中的超链接的基准地址(以base为准标准的地址),
以改变网页中所有使用相对地址的url的基准地址,<base>标签只能用于
文件头部分,只对该页面有效
target属性:
<base target="_blank" />
代表该页面的超链接都以_blank为方式打开
href属性:
<base href="http://www.163.com/zz" />
代表该页面的超链接都以http://www.163.com/zz/
的zz目录为基准地址(zz目录作为起点)
<a href="tt.html">请点击</a>
这时候点击超链接访问地址为:http://www.163.com/zz/tt.html
注意:href属性设定那个该网页中所有使用HTTP协议的URL地址(例如,<a>和<img>标签的href属性值)的基准地址
如果:<base href="zz" />
那么单击:<a href="tt.html">请点击</a>该连接路径为:
http://zz/tt.html它会自动帮你加上http://协议
(2)<link></link>以下就举例说明样式表的例子,其他的很少用,可以查帮助文档
<link rel="stylesheet" type="text/css" href="tt/url">
其中rel="stylesheet"表明目标资源是一张样式表
要注意的是,一个文档可以包含不止一个应用外部样式表的link单元
(3)<meta>标签
主要又两种类型的<meta>,它们用不同的属性名来划分,这两种属性名为name和http-equiv
1) name属性用于在网页中加入一些关于网页的描述信息,例如,网页的关键字(可供网页搜索引擎机器人查找,分类)
,网页的描述信息等.
<meta name="keywords" content="软件开发,vc,java,培训" />设置搜索的关键字
2)http-equiv属性
该属性包括一下功能:通知浏览器查看此网页时应该使用的字符编码,是否在本地缓存此网页,网页到期的时间,是否间隔一定时间以后刷新当前页面或跳转到其他页面等;
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />设置网页的MIME类型和字符编码
<meta http-equiv="refresh" content="2; url=http://jhxk.iteye.com" />设置页面间隔两秒跳转到http://jhxk.iteye.com
<meta>标签的内容还有很多用到可以查帮助文档
三:<div></div>
区域标签(块级元素)可以包含任何html元素,通过改变<div>的属性,可以让其中所有元素随之消失,出现,更改,移动等
<div>应用于Cascading style sheets(层叠样式表)和客户端脚本编程方面会更显威力
<div align="center">
<p>段落1</p>
<img src="img1.gif">
<p>段落2</p>
</div>
以下是错误的:该标签不能包含在段落标签中
<p>aa<div>bb</div>cc</p>
四:<span></span>
<span>标签本身没有任何意义,该标签专门用于css和客户端脚本编程中
比如:要将文本ZhangSan中的前半部分Zhang单独选取出来,作为一个被
css和javascript调用的独立单元,久可以使用<span>Zhang</span>San.
<span>与<div>的不同之处在于:
<div>是一个区块(block)元素
<span>是文本级元素
例如:
<span>aaa</span>bbb
显示效果:
<div>aaa</div>bbb
显示效果:
以上可见<span>本身第嵌套在其中的文本没有任何影响,只能借助于css和客户端脚本编程来对<span>元素进行处理.
- 大小: 12.5 KB
- 大小: 11.3 KB
分享到:
相关推荐
后台模板 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+CSS+DIV网页设计.zipHTML+CSS+DIV网页设计.zipHTML+CSS+DIV网页设计.zipHTML+CSS+DIV网页设计.zipHTML+CSS+DIV网页设计.zipHTML+CSS+DIV网页设计.zipHTML+CSS+DIV网页设计.zipHTML+CSS+DIV网页设计.zipHTML+CSS...
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学习...
HTML+CSS+DIV网页设计源码.zipHTML+CSS+DIV网页设计源码.zipHTML+CSS+DIV网页设计源码.zipHTML+CSS+DIV网页设计源码.zipHTML+CSS+DIV网页设计源码.zipHTML+CSS+DIV网页设计源码.zipHTML+CSS+DIV网页设计源码.zipHTML...
《精通CSS+DIV网页样式与布局》源码.rar 《精通CSS+DIV网页样式与布局》源码.rar 《精通CSS+DIV网页样式与布局》源码.rar 《精通CSS+DIV网页样式与布局》源码.rar 《精通CSS+DIV网页样式与布局》源码.rar
精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通CSS+DIV网页样式与布局.rar精通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》是一本深入探讨Web前端布局技术的专著,主要聚焦于使用CSS(层叠样式表)和Div元素进行网页设计与布局。根据提供的章节信息,我们主要关注1、2、8和10章的内容。下面将详细阐述这些章节涵盖的关键...
div+css百分比表格+DIV+CSS+JS静态分页程序+DIV+CSS像素表格 百分比表格(用DIV+CSS)以百分比显示,可以根据窗口的大小自动调节所显示的大小! DIV+CSS+JS静态分页程序可兼容主流浏览器(IE、FF、Opera) DIV+CSS表格...
HTML+CSS+Div 学习实例教程是网页设计领域中不可或缺的一部分,这三种技术共同构成了网页的静态结构和样式。本教程将深入探讨如何利用它们来创建高效、响应式的网页设计。 HTML(HyperText Markup Language)是网页...
正在学习css+div的朋友应该都知道这几本书吧,《精通css+div 网页样式与布局》还有《css设计彻底研究》这些书都非常好,现在将《精通css+div 网页样式与布局》的ppt文件传上来,这样大家就可以不用买实体书了,至于...
第12章 CSS+div美化与布局实战 12.1 框架搭建 12.2 实例一:蓝色经典 12.3 实例二:清明上河图 12.4 实例三:交河故城 12.5 自动选择CSS样式 第3部分 CSS混合应用技术篇 第13章 ...
"jsp css+div 后台框架"是一种常见的前端与后端技术组合,用于构建高效、美观且用户友好的Web应用程序。这种框架结合了JavaServer Pages(JSP)、Cascading Style Sheets (CSS) 和 Div布局,以实现动态网页设计和...
《CSS+Div构建的高效网站后台模板解析》 在网页设计与开发领域,CSS(Cascading Style Sheets)和HTML的结合使用已经成为构建现代网页的标准技术。尤其在网站后台设计中,CSS+Div布局方式因其灵活性、可维护性和...
【CSS+DIV光盘程序】是一种用于网页设计和布局的技术组合,主要由两部分组成:层叠样式表(Cascading Style Sheets, 简称CSS)和文档对象模型(Document Object Model, DOM)中的<div>元素。CSS是用于描述HTML或XML...
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+css例子div+css例子...
三、CSS+Div模板技术的应用 1. 布局控制:通过CSS+Div,我们可以实现流式布局、网格布局、响应式布局等多种复杂的页面结构。Div元素作为布局的基本单元,通过CSS设置其宽度、高度、边距、浮动等属性,可以灵活调整...
在这个“HTML-CSS+DIV”的主题中,我们将深入探讨如何利用这些技术来创建一个有效的网页布局。 首先,HTML(HyperText Markup Language)是用于创建网页的标准标记语言。它通过一系列标签来定义网页内容的结构,如`...
**CSS+Div网页布局技术详解** 在Web开发领域,CSS(Cascading Style Sheets)与Div元素的结合使用已经成为构建现代网页布局的标准方法。"css+div网站实例源码"提供了一个优秀的学习资源,让我们深入探讨这个主题。 ...