一段时间以来,发现有很多人XHTML都不会用,不光是普通的初学者,有的程序员都不是很清楚该怎么写这个XHTML,我这里呢算是把一些常见的应用问题做一个总结,也算能使得大家能在沟通,合作上能形成默契。

XHTML里有很多的标签,但是经常用到的也就是那么几个,也只要掌握这几个也就可以了。下面我们一一列举:div,p,span,ul,li,dl,dt,dd,a,img,h,strong,em

div 在我的脑子里我一直把他想作是一个瓶子或是箱子,我的感觉它挺硬的。这个div没有什么特性的意义,可以使用在很多地方,也就是说他可以装不同的东西。他的正确的写法是< div> < /div> 必需要有封口。大家都用来做布局之用,也有用来作为存放文章形成段落,实际上,这个做法并不是很好,因为作为文章的分段自然有一个特定的标签来用。那就是下面要讲的< p> < /p> 标签,不过用DIV来再整体的包住所有的段落。这是非常实用的。

p 这是一个有特定语义的标签,表示段落,是用来区分段落的。在大部分的浏览器中对P基本上都有一个上下的边距。但是没有行首缩进,因为行首缩进只是表示段落的方式但是不是一定或是必需的。所以在用P标签的时候如果需要可以针对P设定一下行首缩进,我是推荐在文章以外的地方不要使用P,因为P是有一定语义的,如果用在别的地方恐不合适。正确的写法是< p> < /p>

span 这也是一个非常常用的标签,这个标签可以说与div很像,没有什么特定的意义,只是他是一个级联元素,不是块级元素。我一直把它看作是一个袋子,他不像箱子那样可以有自己的宽高,他的宽高只能随着内容的多少而定,所以很像是袋子。这个标签与div正好互补。

ul,li 这是一个列表,在列表中,除了UL还OL,不过我觉得OL有点像是鸡肋。因为UL通过CSS定义一样可以有OL的数字排序效果。所以一般我不推荐使用 OL,有UL就可以了。UL是块级的,他的子级li也是块级标签。正确的写法是< ul> < li> < /li> < /ul> LI标签是被UL标签包裹的,在UL标签里可以有无数个LI标签,LI标签不能独立使用。并且LI标签一定要封口,这不光是美观问题,对于后期的维护也很有好处。很多程序员都不喜欢把这个LI封口。UL列表的用处主要是列举出一维的,同一类型的数据。具体的比如使用在菜单上,文章中列数的一些条例等等。在列表中有一种特别的形式与UL是不一样的。那就是下面的DL

dl,dt,dd 这是一个很特别的三个标签的组合。这里的DT是指标题,DD是指内容。DL是包课他们的容器。正确的写法是< dl> < dt> < /dt> < dd> < /dd> < /dl> 在DL里可以有很多组的DT,DD,当出现很多组的时候尽量是一个DT配一个DD,如果DD中内容很多,可以在DD里加P标签配合使用。DL列表是一个非常好的列表形式,可以多加利用。

a    这表示链接,是一个特定属性的,也是网页中最为神奇的标签。因为它才让无数的网页都连在了一起。正确的写法是:< a href=" " title=" " > < /a> 其中的href是表示目标地址,TITLE是鼠标悬停提示文字,这是可有可无的。但是有必是利大于无。

img 这是图片标签,也是个特定属性的标签。正常写法是:< img src=" " alt=" " title=" " /> 这里的src是目标地址,ALT与TITLE是替换文字,ALT是 IE特定的,TITLE是其它浏览器的通用的。不过记得后面的反斜线那是一定要有的。

H 这是一个系列的标签,从H1到H6,一共六个,有人说太少了,有人说正好用,有人说用不了这么多。反正我是觉得差不多。正确写法是:< h> < /h> 主要是用来存放标题,也有一些朋友用来作它用,个人觉得这个标签还是让他安生一点,就让他做标题的作用。这六个标签之间最好不要出现什么相互包含的事。

strong 这个意思是着重,这是有语义的,作用也很简单。至于样工,是加粗着重,还是用色彩表明着重,那都是自行选择。正确的写法是< strong> < /strong>

em 这个与strong很像,是表示强调。一般浏览器的默认值是斜体。使用方式与strong一样。写法是:< em> < /em>

html几个重要标签用法(div,p,span,ul,li,dl,dt,dd,a,img,h,strong,em)相关推荐

  1. DIV+CSS中标签ul ol li dl dt dd用法

    ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...

  2. Div+CSS布局入门教程(五) 页面制作-用好border和clear 附加:1.DIV+CSS设计原则 2.DIV+CSS中标签ul ol li dl dt dd用法

    这一节里面,主要就是想告诉大家如何使用好border和clear这两个属性. 首先,如果你曾用过table制作网页,你就应该知道,如果要在表格中绘制一条虚线该如何做,那需要制作一个很小的图片来填充,其 ...

  3. div+css布局必了解的列表元素ul ol li dl dt dd详解

    dt 和dd中可以再加入 ol ul li和p,理解这些以后,在使用div布局的时候,会方便很多,其实w3c提供了很多元素辅助布局都是有它的用处的,而不尽是div. 块级元素div尽量少用,其实和ta ...

  4. dl dt dd标签具体用法

    一般我们在做列表的时候通常只会用到ul和li标签,至于DL一般都很少用到,它也属于列表类的标签,下面说一下大概的用法: <dl>标记定义了一个定义列表,定义列表中的条目是通过使用<d ...

  5. dl dt dd 标签的用法(二)

    dl>< /dl>用来创建一个普通的列表   < dt>< /dt>用来创建列表中的上层项目 < /dd>用来创建列表中最下层项目   < ...

  6. html中dl标签和ul标签,html中dl,dt,dd,ul,li,ol标签区别和使用

    html中dl,dt,dd,ul,li,ol标签区别和使用 时间:2013-04-12 21:48 来源:未知 | 作者:易享学习网 | 本文已影响 人 ul: unordered lists ol: ...

  7. 用dl元素编辑html个人信息,html dl dt dd标签元素语法结构与使用

    dl dt dd认识及dl dt dd使用方法 一.dl dt dd认识   -   TOP html 是一组合标签,使用了dt dd最外层就必须使用dl包裹,此组合标签我们也又叫表格标签,与tabl ...

  8. html dd标签隐藏,HTML dl dt dd 标签

    一.dl dt dd 初步认识 html 是一组合标签,使用了dt dd最外层就必须使用dl包裹,此组合标签我们也又叫表格标签,与table表格类似组合标签,故名我们也叫dl表格. 为常用标题+列表型 ...

  9. 用标准dl,dt,dd标签抛弃table列表

    过去有很多网页设计师喜欢将他们的网页效果图用table布局实现成网页,但是这样做会遇到一个比较麻烦的问题就是,后期调试和维护会相当的困难. 现在,越来越多的前端开发er们开始使用xHTML+CSS替代 ...

  10. 【转】网页制作中的CSS+DIV:dl,dt,dd分别表示什么意思啊?请说明啊,谢谢有什么功能?...

    网页制作中的CSS+DIV:dl,dt,dd分别表示什么意思啊?请说明啊,谢谢有什么功能? <dl>标记定义了一个定义列表,定义列表中的条目是通过使用<dt>标记(" ...

最新文章

  1. python3.8使用requests_python3.8.1 入门基础学习 之 【 requests 基础学习,python3爬虫必备基础】...
  2. optee中MMU内存管理模型-页表的建立模型
  3. 联想服务器开机自动重启,解决联想电脑开机一半自动重启的方法
  4. 在sql当中为了让数据做缓存做with as的操作
  5. Linux Kickstart无人值守安装(上)
  6. leetcode1020. 飞地的数量(dfs)
  7. ACM所有算法大全(持续更新)
  8. 如何使用CCRenderTexture创建动态纹理 Cocos2d-x 2 1 4
  9. UI设计实用干货素材|引导页模板
  10. java类初始化_Java的类/实例初始化过程
  11. java培训学费_太原java培训班价格表
  12. 谷歌浏览器input中的text 和 button 水平对齐的问题
  13. 低代码开发,未来已来
  14. CountDownLatch详解
  15. netty如何知道连接已经关闭,socket心跳,双工?异步?
  16. Hybird方案-概述
  17. 攻防世界 --> funny_video --> 最完整和正确的解答
  18. LC-恢复二叉搜索树(JavaScript实现)
  19. Mono.Cecil使用示例之获取源文件路径
  20. 技术 | 脑电的现在与未来

热门文章

  1. CCI: Representing N cents
  2. Apache Doris 的一场编译之旅
  3. 为什么苹果蓝牙耳机连上还是公放_史上最好用的蓝牙无线耳机?苹果AirPods神奇在哪里!...
  4. 短网址还原 php,PHP将微博短地址还原为实际网址
  5. 华三交换机配置ntp server
  6. 一种绘制有向图的方法<TSE93> - 2. 最优层级分配
  7. android botton控件基本属性
  8. bootstrap 半透明背景_微信透明与半透明头像制作,全解析教程
  9. 超微晶磁芯在开关电源中的应用
  10. Geoserver发布OSM官网地图