无法在这个位置找到: head2.htm
当前位置: 建站首页 > 新闻动态 > 行业新闻 >

菏泽企业网站建设公司-网页制作列表标记ul,ol,

时间:2021-04-13 14:54来源:菏泽企业网站建设公司 作者:jianzhan 点击:
一、能看做空话的序言HTML目录原素(如ol,ul,dl)等在现下的网站建设制作中拥有十分普遍的运用,但是,他们的不在同访问器下的性子却不一样。文中便是剖析这种目录原素的基本特点
--------

菏泽企业网站建设公司

-------

一、能够看作空话的序言
HTML目录元素(如ol,ul,dl)等在现下的网站开发设计制作中有着十分普遍的运用,但是,它们的在不一样访问器下的脾气却不一样。本文就是剖析这些目录元素的基本特点,在不一样访问器下的各类适配性难题,和详细介绍一些普遍的运用等。

对初学者或是有一定CSS方面工作经验的同行业们应当会有协助的。

二、HTML中可用的目录元素
1、无编码序列表:ul
无编码序列表是最常应用的目录,下图显示信息了无编码序列表在不一样访问器下的显示信息:

demo网页页面

正如上面显示信息的,无编码序列表在不一样访问器下的默认设置设定是由些许差别的。自然,在现如今具体的网站新项目上是非常少看到沒有任何装饰的无编码序列表了。在其中缘故之一就是CSS的重设(css reset),早已将无编码序列表默认设置的目录新项目标记,margin或padding都去掉了。

无编码序列表的一些特殊的css特性有list-style-type,list-style-position,和list-style-image。这些特性设定了目录新项目标记的种类,标识的部位,和应用照片替代标识。这三个特性能够应用list-style开展合拼缩写。

list-style-type特性能够设定为一些不一样的值,下面图表展现的就是一部分值的网页页面实际效果:

依靠于客户的访问器及实际操作系统软件,某些list-style-item值将会不可以正确显示信息,一般默认设置为十进制标值,用无需目录完成递增标值是不强烈推荐的,由于这样 无编码序列表 其自身的词义早已不复存在了。

list-style-position针针对目录标识的部位,能够被设定为outside(默认设置)或是inside。假如list-style-image被设定的话,其也会危害照片的部位。

list-style-image特性能够给无编码序列表一个自定的唯一无二的主要表现,悲剧的是,在IE下应用此方式加上新项目编号是bug多多,故非常少被应用。一个更好的处理方式是加上background image到目录的li元素上,并相应的调剂background image的部位,并设定为no-上,早已根据分步解读演试了这个方式,并且在全部的访问器下都工作中优良。

2、井然有序目录:ol
井然有序目录在当目录新项目的每一个目录新项目前面需要一个递升值的情况下应用(例如1,2,3等)。井然有序目录的目录种类list-style-type能够被设定为任在哪无编码序列表下能够设定的值。在大一部分状况下,井然有序目录要末前面是个递增标值,要末前面沒有任何标识。不提议应用井然有序目录完成相近于无编码序列表的主要表现。由于这样,井然有序目录自身的词义早已不正确了。

3、界定目录:dl
界定目录用来标识早已界定的目录项,它们包含界定题目(dt)和界定自身(dd)。界定目录新项目沒有必要彻底配对,下面的编码在严苛的XHTML下是彻底合理合法的:

 dt 无线网络歌曲咪咕汇 /dt 
 dt 哥本哈根大会 /dt 
 dd 《十月围城》 /dd 
 /dl 

这样,您能够在单独dd下面应用多个dt,还可以在单独dt下面应用多个dd。

界定目录的视觉效果显示信息,默认设置状况下,各个访问器的显示信息基本上是一致的,以下图所示:

demo网页页面

上图对应的HTML编码以下:

 dl dt 题目 /dt dd 这里是界定的內容 /dd /dl 
 dt 热门电影 /dt 
 dd 十月围城 /dd dd 刺陵 /dd dd 三枪拍案惊讶 /dd dd 阿凡达 /dd 
 /dl 
 dt 网络热点关心 /dt 
 dd 股市 /dd dd 房价 /dd dd 元旦 /dd dd 曹操墓 /dd 
 /dl 

4、落伍取代的目录:menu dir
menu 和 dir 元素,从技术性上说,还可以称为 HTML目录 ,但它们在XHTML中已落伍取代了,因此这里不详尽探讨它们。

5、HTML5中的目录

在HTML中,无编码序列表基本上维持不会改变,尽管好像如今它被简称为 目录 ,新的元素将被用来包裹目录作为导航栏应用。

ol元素有轻度的更改,它得到了两个新特性:reversed,这是一个布尔运算值,用来表明目录是升高還是降低;start,这是个整数金额,用以宣布井然有序目录的起始点。

另外, figure 和 details 元素将被提升,它们会有子元素,在其中包含 dt 和 dd 元素。

---------

菏泽企业网站建设公司

------------ (责任编辑:admin)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
无法在这个位置找到: ajaxfeedback.htm
栏目列表
推荐内容


扫描二维码分享到微信