当前位置:首页 > 技术知识 > 正文内容

DIV+CSS技术使用技巧_css dive

maynowei10个月前 (09-11)技术知识87


一、使用 div 后,什么时候使用 table

Web标准并不排除表格的使用,但使用表格排版是不明智的,因为表格归根结底只是一种显示“数据”的方式。大家应该知道,在 Excel 中,表格就是用来放置数据信息的。使用表格显示信息能让浏览者阅读起来更轻松,表达也更清楚。

XHTML 中的元素可分为三大类,下面分别介绍。

辅助布局设计元素:主要指div、span等,这类元素的主要功能是布局整个页面。灵活使用这些元素,能让网页丰富多彩。

结构化元素或信息元素:主要指table、ul、pre、code等元素,是一种信息显示与整理方式,如 table 是用来显示表格信息的,ul是用来显示列表信息的,当需要用表格或列表的时候,用这两种方式来显示是合理的。

为实现某些功能而添加的元素:如添加关键字的meta keyword,设置链接的a等。由上面的分析可知,符合Web标准的设计思路是,使用div等布局元素来制作页面的布局、定位、色块、图像等,使用table、ul等元素来显示页面中需要展示的数据。这实际上是一个信息合理化整合的过程,什么地方该用什么元素还是照用不误。

二、初学 Web 标准的几个误区

初次接触 Web标准的用户可能会受表格布局或其他一些问题的影响,常见问题及解决建议如下:

1.不要用传统的表格思维来套div

用惯了表格的用户可能会觉得,CSS 布局就是将原来用table的地方用div来代替,原来是 table 嵌套,现在是 div嵌套。这种观点是错误的。

应该跳出表格布局的禁锢,抛弃一个td接一个td放置内容的思维方式。按前文所述,Web标准的目的是将内容和表现完全分离。即在加入表现之前,页面里有的仅仅是内容,在没有修饰的情况下,它就是一张有一些文字和图像(图像是指内容中的图像,是有真正意义的图像,而非修饰性的图像)的简单页面,这些文字和图像仅仅是依次罗列下来,只有结构,没有任何样式。当加人表现,将所有修饰的图像作为背景,用CSS 来定义每一块内容的位置、字体、颜色等时,才构成了一个完整的页面。

这样制作的页面才是内容与表现完全分离的,即抽掉 CSS 文件,剩下的就只是干净的内容。

2.不必为每块内容都创建一个id

内容都是有结构的,相同结构的内容可以用同一个样式来定义,如相同级别的标题、正文、图像等。对干多次引用的样式可以用cass 来定义,不需要全部用id:另外也不是说只能用 div 布局,在需要的时候,完全可以用p来代替。

至于仅仅为了行高、间距,或者一个修饰性图像而增加的div,随着大家对 CSS应用的熟练和理解,很快就会知道这是没有必要的。希望大家多研究 CSS,做出最简练、最有效的样式表。

相关文章

记录程序第一天挖漏洞的过程(挖漏洞需要学什么语言)

第一个漏洞复现fastjson漏洞说明:在本地这个fastjson会出现问题复现的过程生成一个java文件进行攻击注入的方式javac Exploit.java但是必须编译成.class文件才能执行p...

Django 官方推荐的姿势:类视图(django类视图和函数视图哪个好)

作者:HelloGitHub-追梦人物在开发网站的过程中,有一些视图函数虽然处理的对象不同,但是其大致的代码逻辑是一样的。比如一个博客和一个论坛,通常其首页都是展示一系列的文章列表或者帖子列表。对处理...

一文弄懂 GO 的 互斥锁 Mutex !(互斥锁的使用方法)

在 Go 语言并发编程中,互斥锁(Mutex)是一个非常重要的同步原语。本文将深入介绍 Mutex 的使用方法、实现原理以及最佳实践。1. 什么是 Mutex?Mutex(互斥锁)是一种用于多线程编程...

如何在Go中同步线程(go语言同步锁)

单线程代码已经带来头痛。添加第二个线程,就是从基础头痛升级了。解决方案?互斥锁:线程和数据的交通警察。一旦你理解了它们,线程同步就变成了第二本能,语言无关。在C++和Go中工作,我遇到过所有常见的混乱...

LabVIEW实现Oracle数据库的访问(labview数据库查询界面)

1. 安装 Oracle 客户端下载:从 Oracle 官方网站下载适用于 Windows 操作系统的 Oracle 驱动程序。确保下载的版本与 LabVIEW 环境和操作系统兼容。1)以 Windo...

Oracle数据库无法连接问题排查(oracle数据库连接不成功)

数据库告警日志 如下图 。发现 问题时间段,没有 数据库服务故障 报错,但是存在较多 TNS-12535 、 12560 、 12170 、 00505 错误:通过检查问题时间段应用日志, 也记录了...