挖掘经典:几乎被人遗忘的HTML七种用法 (转)

转来学习http://www.cnblogs.com/netWild/archive/2010/11/30/1892418.html

当今的WEB领域,新概念、新技术不断涌现 -- WEB2.0、AJAX、HTML5.0... ...

但在几乎被我们忽略的HTML和XHTML里,还有许多并不为人所知的,但却非常有用的一些TAG

以下就是其中的七种用法:

 


 

 

一、元素分组:<fieldset>、<legend>

示例:

  

1 <fieldset>   
2 <legend>健康信息:</legend>   
3 <form>   
4 <label>身高:<input type="text" /></label>   
5 <label>体重:<input type="text" /></label>   
6 </form>   
7 </fieldset>  

 

 

效果:


 

二、元素标注:<label>

示例:

  

1 <form>   
2   <label for="male">Male</label>   
3   <input type="radio" name="sex" id="male" />   
4   <br />   
5   <label for="female">Female</label>   
6   <input type="radio" name="sex" id="female" />   
7 </form> 

 

 

效果:


 

三、所有链接规定默认地址或默认目标:<base>

示例:

 

 1 <html>   
 2  <head>   
 3 <base href="http://www.w3school.com.cn/i/" mce_href="http://www.w3school.com.cn/i/" />   
 4 <base target="_blank" />   
 5 </head>   
 6   
 7 <body>   
 8 <img src="eg_smile.gif" mce_src="eg_smile.gif" /><br />   
 9 <p>请注意,我们已经为图像规定了一个相对地址。由于我们已经在 head 部分规定了一个基准 URL,浏览器将在如下地址寻找图片:</p>   
10 <p>"http://www.w3school.com.cn/i/eg_smile.gif"</p>   
11   
12 <br /><br />   
13 <p><href="http://www.w3school.com.cn" mce_href="http://www.w3school.com.cn">W3School</a></p>   
14 <p>请注意,链接会在新窗口中打开,即使链接中没有 target="_blank" 属性。这是因为 base 元素的 target 属性已经被设置为 "_blank" 了。</p>   
15   
16 </body>   
17 </html>  

 

 

 

四、上标与下标:<sup>、<sub>

示例:

  

1 <p>   
2 This text contains <sub>subscript</sub>   
3 </p>   
4   
5 <p>   
6 This text contains <sup>superscript</sup>   
7 </p> 

 

 

效果:

 

 

五、分层列表:<dl>、<dt>、<dd>

示例:

  

1 <dl>   
2   <dt>咖啡</dt>   
3   <dd>黑色的热饮料</dd>   
4   <dt>Milk</dt>   
5   <dd>白色的冷饮料</dd>   
6 </dl>

 

 

效果:

 

 

六、选项组:<optgroup>

示例:

  

 1 <select>   
 2   <optgroup label="Swedish Cars">   
 3     <option value="volvo">Volvo</option>   
 4     <option value="saab">Saab</option>   
 5   </optgroup>   
 6   <optgroup label="German Cars">   
 7     <option value="mercedes">Mercedes</option>   
 8     <option value="audi">Audi</option>   
 9   </optgroup>   
10 </select> 

 

 

效果:

 

 

七、图像映射:<map>

示例:

  

 1 <html>   
 2 <body>   
 3   
 4 <p>请点击图像上的星球,把它们放大。</p>   
 5   
 6 <img   
 7 src="/i/eg_planets.jpg"   
 8 border="0" usemap="#planetmap"   
 9 alt="Planets" />   
10   
11 <map name="planetmap" id="planetmap">   
12   
13 <area   
14 shape="circle"   
15 coords="180,139,14"   
16 href ="/example/html/venus.html"   
17 target ="_blank"   
18 alt="Venus" />   
19   
20 <area   
21 shape="circle"   
22 coords="129,161,10"   
23 href ="/example/html/mercur.html"   
24 target ="_blank"   
25 alt="Mercury" />   
26   
27 <area   
28 shape="rect"   
29 coords="0,0,110,260"   
30 href ="/example/html/sun.html"   
31 target ="_blank"   
32 alt="Sun" />   
33   
34 </map>   
35   
36 <p><b>注释:</b>img 元素中的 "usemap" 属性引用 map 元素中的 "id" 或 "name" 属性(根据浏览器),所以我们同时向 map 元素添加了 "id" 和 "name" 属性。</p>   
37   
38 </body>   
39 </html>   

 

 

效果:

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/465209.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

这种扯淡的嵌入式项目,尽量不要碰

第一种&#xff1a;画大饼的项目不接。有的客户会很热情的找到你&#xff0c;告诉你这个项目如何如何地有前途&#xff0c;产品研发成功了之后会有多么大的出货量&#xff0c;会有多么丰厚的利润&#xff0c;建议你一起跟他创业合作&#xff0c;成功了之后给你高额提成。但是产…

高频面试题,malloc实现

面试官&#xff1a;你好&#xff0c;请先做自我介绍我&#xff1a;巴拉巴拉&#xff0c;我喜欢打篮球……面试官&#xff1a;请解释下malloc的实现原理我&#xff1a;我不会面试官&#xff1a;那就先这样&#xff0c;我们就不浪费大家的时间了。在开发c或c时&#xff0c;经常需…

单机版简易考试系统开发过程讲解(C#注册机、用户注册、考试系统、×××全部源码)...

前些日子有个朋友&#xff0c;找我做一个考试软件&#xff0c;浙江省驾驶员理论包考专用系统&#xff0c;总共也没几个页面需要做&#xff0c;但是他以前的数据库VFP的数据&#xff0c;题库里有几千条数据&#xff0c;若人工录入几乎比太可行&#xff0c;他把原来的软件&#x…

CF 1025C Plasticine zebra

昨晚忘记判只有一个字符的情况fst了呜呜呜 挺有趣的题&#xff0c;昨晚连刚带猜弄出结论 考虑答案的取值&#xff0c;最优答案可能是一个后缀&#xff0c;或者是一个前缀&#xff0c;或者是一个后缀加上前缀 那么翻转之后最优答案的可选值就有了1的前缀n的后缀 对于一个合法的z…

嵌入式|这些年我都是怎么找兼职的?

‍‍‍‍1这篇文章是在上一篇文章之后写的&#xff0c;因为上篇文章写到了嵌入式找兼职的一些坑&#xff0c;下面有同学留言说要怎么找到兼职项目&#xff0c;所以这篇文章会写一些我的兼职经历还有总结建议&#xff0c;希望对大家如何找兼职有一些帮助。这篇文章是写第二次了&…

linux java的启动内存溢出,java - Java的R代码可在Linux上运行,但不能在Windows中运行 - 堆栈内存溢出...

我在做什么&#xff1f;我正在用Java编写一个数据分析程序&#xff0c;该程序依赖R的arulesViz库来挖掘关联规则。我想要什么&#xff1f;我的目的是将规则存储在Java中的String变量中&#xff0c;以便以后进行处理。它是如何工作的&#xff1f;该代码分别使用String.format和e…

这届毕业生薪资高,是真的

‍‍‍‍最近一份校招的薪资上了知乎的热搜榜。大家想查薪资的&#xff0c;可以用这个微信小程序offershow>查薪资的小程序<可以看到这个小程序可以查到的企业还挺多的&#xff0c;方便大家在选择工作谈薪资的时候做下参考。额&#xff0c;我这篇文章不是为了介绍这个小程…

这辆迷你摩托车,很酷!

摘要&#xff1a;平衡小车大家应该见到过很多了&#xff0c;比如最有名的要数野生钢铁侠稚晖君的自行车平衡小车了。那个玩意太高级一般人做不出来&#xff0c;作为学生或者DIY爱好者做一辆小型的mini平衡小车还是可以实现的。随着16届恩智浦杯全国大学生智能汽车大赛新增单车拉…

linux errno 线程,Linux errno 错误对照表

errno 在 中定义&#xff0c;错误 Exx 的宏定义在 /usr/include/asm-generic 文件夹下面的 errno-base.h 和 errno.h&#xff0c;分别定义了 1-34 、35-132 的错误定义。strerror() 函数依据 errno 值返回错误描述字符串&#xff0c;下面程序打印对照表&#xff1a;Code highli…

如何当好独立CIO(1)

如何当好独立CIO(1)出处:信息方略 文: 刘少东 评论( 0 )条 论坛 博客导读&#xff1a;独立CIO一般有比较丰富的信息化管理经历&#xff0c;具有新的想法和思路&#xff0c;视野也更加开阔&#xff0c;能够以局外人的身份冷静、客观地分析企业战略&#xff1b;同时&#xff0c;这…

提高单片机设计的10个细节

前言1 干扰对单片机应用系统的影响1.1测量数据误差加大1.2 控制系统失灵1.3 影响单片机RAM存储器和E2PROM等1.4 程序运行失常2 如何提高我们设备的抗干扰能力2.1 解决来自电源端的干扰2.2 模拟信号采样抗干扰技术2.3 数字信号传输通道的抗干扰技术2.4 硬件监控电路2.5 PCB电路合…

童继龙:论ERP顾问的创新分享与专业精神

童继龙&#xff1a;论ERP顾问的创新分享与专业精神出处:51CTO博客 文: 童继龙 评论( 0 )条 论坛 博客导读&#xff1a;公司的核心价值观中有一部分为“持续创新”&#xff0c;对实施同事的行为态度考核中有两项为“创新分享”和“专业精神”&#xff0c;因为上海实施部的新同事…

图解分析 Linux 网络包发送过程

大家好&#xff0c;下面的文章转发一个鹅厂同学的文章&#xff0c;这篇文章从应用到内核&#xff0c;写的非常不错&#xff0c;希望大家分析某个技术也可以从这方面入手。-----大家好&#xff0c;我是飞哥!半年前我以源码的方式描述了网络包的接收过程。之后不断有粉丝提醒我还…

[Pku 2774] 字符串(六) {后缀数组的构造}

{ 从这一篇开始介绍后缀数组 一个强大的字符串处理工具 可以先研读罗穗骞的论文 后缀数组——处理字符串的有力工具 再行阅读本文 本文仅作参考和补充 } 字符串的后缀很好理解 譬如对于字符串"aabaaaab" 后缀有{"b","ab","aab","…

linux下I2C驱动发送IO时序,笔记四:linux下IO口模拟实现I2C协议

一、i2c总线是什么&#xff1f;1、i2c总线是一种物理总线及实实在在的总线&#xff0c;通过板子pcb等图能看到。2、i2c总线是一种主从结构。3、i2c总线是一种通信协议。4、i2c总线是两线制半双工串行总线&#xff1a;两线制&#xff1a;数据线(SDA)——>数据传输、时钟线(SC…

rails3异步发邮件

actionmailer 3.0 结合ar_mailer_rails3 异步发送邮件3 次投票jerry 分享于 3 个月 前, 0 条回复, 244 次浏览Share|actionmailer 3.0 的用法有所改进&#xff0c;并结合ar_mailer_rails3做异步邮件的发送&#xff0c;是比较方便的一种选择&#xff0c;把邮件都交给后台任务来发…

我见过的极品代码bug

程序员写代码有bug是很难避免的&#xff0c;也是因为程序员的bug存在&#xff0c;才让另一个职业有了更好的发展&#xff0c;那就是软件测试行业。但是程序员写bug&#xff0c;对于自己肯定是一件非常难忘的事情。我记得我在之前做一个TP固件升级的功能&#xff0c;也就是开机的…

Linux监控服务并主动重启

Linux查询后台进程&#xff0c;如果没有进程号&#xff0c;则重启服务&#xff1a; #!/bin/sh basepath$(cd dirname $0; pwd) while true doprocnumps -ef|grep "服务名称"|grep -v grep|wc -lif [ $procnum -eq 0 ]then#启动命令echo date %Y-%m-%d date %H:%M:%S …

双一流大学毕业的我,应该何去何从?

内卷时代&#xff0c;万物皆可卷&#xff01;什么是内卷&#xff0c;比如&#xff0c;你在电影院看电影&#xff0c;有一个人站起来了&#xff0c;那么就会有第二个人站起来&#xff0c;没一会儿所有的人就站起来了&#xff0c;但是和坐着相比&#xff0c;站着看电影体验感很差…

接上电就工作的单片机

对于手边的一盒STC单片机&#xff0c;测试一下它们使用相同的ISP方案在下载过程中是否都可以按照相同的方式完成程序的下载。同时对它们建立各自的元器件库&#xff0c;以便于后期的应用。通过这个实验&#xff0c;看到STC的单片机使用起来真实简捷明了&#xff0c;接上电就工作…