IT兄弟连 HTML5教程 “无意义”的HTML元素div和span

HTML只是赋予内容的手段,大部分HTML标签都有其意义(例如,标签a创建链接,标签h1创建标题等),然而div和span标签似乎没有任何内容上的意义,听起来就像一个泡沫做成的锤子一样无用。但实际上,与CSS结合起来后,它们的应用十分广泛。需要记住的是,div和span是“无意义”的标签,它们的存在纯粹是为了应用CSS样式,所以当样式表失效时,它们就没有了任何作用。
它们被用来组合成一大块的HTML代码并赋予一定的信息,大部分用类属性class和标识属性id与元素联系起来。span和div的不同之处在于,span是内联的(行内标记),用在一小块的内联HTML中;而div(division)元素是块级的(简单地说,它等同于其前后有断行),用于组合一大块的代码,为HTML文档内大块的内容提供结构和背景的元素,可以包含段落、标题、表格甚至其他部分,这使得div便于建立不同集成的类。

div的起始标签和结束标签之间的所有内容都是用来构成这个块的,其中所包含的元素的特性由div标签的属性来控制,或者通过使用样式表格式化这个块来进行控制。
IT兄弟连 HTML5教程 “无意义”的HTML元素div和span的更多相关文章
- IT兄弟连 HTML5教程 HTML文档头部元素head
HTML头部标记是<head>,主要包括页面的一些基本描述语句,以及CSS和JavaScript,一般都可以定义在头部元素中.它用于包含当前文档的有关信息,例如网页标题和关键字等.通常位于 ...
- IT兄弟连 HTML5教程 HTML5表单 HTML5新增表单元素
HTML5有一些新的表单元素:<datalist>.<keygen>.<output>.不是所有的浏览器都支持HTML5新的表单元素,但即使浏览器不支持该表单属性, ...
- IT兄弟连 HTML5教程 HTML5的基本语法 小结及习题
小结 一个完整的HTML文件由标题.段落.列表.表格.文本,即嵌入的各种对象所组成,这些逻辑上统一的对象称为元素.HTML文档主体结构分为两部分,一部分是定义文档类型,另一部分则是定义文档主体的结构框 ...
- IT兄弟连 HTML5教程 DIV+CSS网页标准化布局 小结及习题
小结 DIV+CSS布局页面的优势:表现和内容相分离.代码简洁,提高页面浏览速度.易于维护和改版.提高搜索引擎对网页的索引效率.每个HTML元素都可以看作一个区块,类似于装了东西的盒子,称为盒子模式. ...
- IT兄弟连 HTML5教程 DIV+CSS网站首页布局示例
首页的设计直接影响网站的整体形象,虽然没有一个统一的规范,但最好将其设计为大众化的,只要信息内容能够合理地编排即可,使用户可以方便地找到需要的信息.另外,首页的高度最好不要超过三个屏幕,页面中使用的颜 ...
- IT兄弟连 HTML5教程 DIV+CSS网页标准化布局的优势
标准的网页都需要对内容进行布局,以前都是采用表格的定位技术,从2005年开始逐步转向DIV+CSS的布局方式,目前绝大多数的网站都是采用这种布局方式.使用DIV+CSS对网站进行布局符合W3C标准,采 ...
- IT兄弟连 HTML5教程 多媒体应用 新增多媒体播放元素
在HTML5之前,要在网站上展示视频.音频.动画等多媒体信息,除了使用第三方自主开发的播放器,使用最多的工具应该算是Flash了,但是它们都需要在浏览器中安装各种插件才能使用,有时速度很慢.HTML5 ...
- IT兄弟连 HTML5教程 CSS3揭秘 小结及习题
小结 CSS3对于开发者来说,给web应用带来了更多的可能性,极大提高了开发效率.CSS3在选择器上的支持可谓是丰富多彩,使得我们能够灵活的控制样式,而不必为元素进行规范化的命名.CSS3支持的动画类 ...
- IT兄弟连 HTML5教程 多媒体应用 小结及习题
小结 在互联网上,图像和链接则是通过URL唯一确定信息资源的位置.URL分为绝对URL和相对URL.通过使用<img />标记在浏览器中显示一张图像.超文本具有的链接能力,可层层链接相关文 ...
随机推荐
- Chapter 07-Basic statistics(Part3 correlations)
这一部分使用R基础已安装包中的state.x77数据集.该数据集的数据是关于美国50个州在1977年对人口,收入,文盲率,平均寿命,谋杀率,高中毕业率统计所得. 1.关联的种类(types of co ...
- 成功的面对对象语言的五个基本特性——Alan Kay
1.万物皆为对象. 将对象是为奇特的变量,它可以存储数据,除此之外,还可以要求他在自身上执行操作. 2.程序是对象的集合,他们通过发送消息来告知彼此所要做的. 要想请求一个对象,就必须对该对项发送一条 ...
- stream,做减法,优化搜索代码。
做一个搜索,三个输入条件,求这个条件的交集.起初我的思路是按照操作的流程,一步步的来做这三个筛选. let searchResults = []; //step1 根据id搜索,得到一个子集. if ...
- PHP常用字符串函数总结
PHP语言中的字符串函数也是一个比较易懂的知识.今天我们就为大家总结了将近12种PHP字符串函数,希望对又需要的朋友有所帮助,增加读者朋友的PHP知识库. 1.查找字符位置函数 strpos($str ...
- Kafka分区分配策略分析——重点:StickyAssignor
“ 为什么Kafka在RangeAssigor.RoundRobinAssignor的基础上,又新增了PartitionAssignor,它解决了什么问题?” 背景 用过Kafka的同学应该都知道Ka ...
- 【解决】error pulling image configuration: Get https:// ...... x509: certificate has expired or is not yet valid
[问题]进行镜像拉取时报错 [分析] 很多人会被第一句所蒙蔽,按照网上教程进行修改etc/sysconfig/docker,之后发现还是没有用. 其实这里重点是最后一句"certificat ...
- HDU5394 Bomb
题目:http://acm.hdu.edu.cn/showproblem.php?pid=5934 There are NN bombs needing exploding. Each bomb ha ...
- 大数据学习笔记——Hive完整部署流程
Hive详细部署教程 此篇博客承接上篇Hadoop和Zookeeper的部署教程,将会详细地对HIve的部署做一个整理,Hive相当于是封装在HDFS和Mapreduce上的一套sql引擎,只需要安装 ...
- Linux内核构建过程
构建内核 # shell 执行如下指令make zImage 全局变量 srctree := $(if $(KBUILD_SRC),$(KBUILD_SRC),$(CURDIR))objtree ...
- python学习-caculator
# 运算符操作# 算术运算符num_a = 100num_b = 5000 # 加法print(num_a + num_b)# 减法print(num_a - num_b)# 乘法 *print(nu ...