div、span
1.Html区块元素
HTML可以通过<div>和<span>将元素组合起来
大多数HTML元素被定义为块级元素或内联元素,
而块级元素在浏览器显示时,通常会以新行来开始(或结束)。如:<h1>,<p>,<ul>,<table>
内联元素在显示时通常不会以新行开始。如:<b>,<td>,<a>,<img>
2.<div>元素
HTML <div> 元素是块级元素,它是可用于组合其他 HTML 元素的容器。
<div> 元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行。
如果与 CSS 一同使用,<div> 元素可用于对大的内容块设置样式属性。
<div> 元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。
默认情况下,浏览器通常会在<div>元素前后放置一个换行符。(可以通过css改变这种情况
1.设置float
设置float:left样式让div对象靠左,这样div会失去本身的宽度样式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>无标题文档</title>
<style>
div{ float:left}
</style>
</head>
<body>
<div>第一个div盒子</div>
<div>第二个div盒子</div>
</body>
</html>
2.设置display样式
设置display:inline样式让div失去默认100%独占一行的宽度
display:inline(让对象并排显示)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>div并排实例 www.dvicss5.com</title>
<style>
div{ display:inline}
</style>
</head>
<body>
<div>第一个div盒子</div>
<div>第二个div盒子</div>
</body>
</html>
)
2.1属性
属性 | 值 | 描述 |
align |
left right center justify |
html5中不支持 |
3.<span>元素
<span>元素是内联元素,可以作为文本的容器,没有特定的含义。当与CSS一起使用时,<span>元素可以用于为部分文本设置样式属性。
3.1说明
<span> 用于对文档中的行内元素进行组合。
<span> 标签没有固定的格式表现。当对它应用样式时,它才会产生视觉上的变化。如果不对 <span> 应用样式,那么 <span> 元素中的文本与其他文本不会任何视觉上的差异。
<span> 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。
div、span的更多相关文章
- 让HTML标签、DIV、SPAN拥有focus事件和blur事件,聚焦和失焦
DIV和其他普通标签是不具有onfocus和onblur事件的.INPUT和A标签为什么拥有?而DIV和SPAN等普通标签却没有?有时候我们习惯性用键盘的TAB来移动光标,仔细看你会发现,光标只在IN ...
- div、span绑定内容改变事件
内容改变事件onchange只适用于form表单标签(input.select.textarea) 当需要对div.span标签进行内容改变监听则无法适用,查阅了一些资料发现jquery有针对的方法, ...
- 1、前端--HTML简介、head内常见标签、body内常见标签(特殊符号、div、span、a、img、列表、表格table、表单form)、标签两大属性
今日内容 HTML简介 HTML是构造网页的骨架>>>:几乎所有的网站都是由HTML构建而成 HTML:超文本标记语言 # 不是一门编程语言 没有任何的逻辑 只有固定的标记功能 &q ...
- HTML中Div、span、label标签的区别
div与span 大家在初学div+css布局时,有很多困惑,在div与span的使用过程没觉得有一定的”章法”,觉得两个区别不大,在w3c的关于div和span的定义:div作为分割文档结构自然使它 ...
- JS 实现点击页面任意位置隐藏div、span
通过调用下面的 showhidden(“标签ID”) 显示div/span/…等标签内容,可以实现点击页面任意地方再次隐藏该标签内容,而showhidden(“标签ID”,”nohidden”)可保存 ...
- div、span内容超出省略号
span设置部分省略...: span{ overflow: hidden; text-overflow: ellipsis; -o-text-over ...
- 真正让HTML标签、DIV、SPAN拥有onfocus和onblur,聚焦和失焦
转载:http://blog.sina.com.cn/s/blog_7dfe67db01010lnq.html 默认火狐或者其他浏览器里DIV和其他普通标签是不具有onfocus和onblur事件的, ...
- Jquery系列:设置div、span等dom结点的内容,jquery中没有innerText、innerHtml
发现如果我在div或者其他非表单的标签中赋值,原本用普通的js就直接document.getElementById("id").innerHtml(或者其他几个)就可以了. 但是在 ...
- (4)《Head First HTML与CSS》学习笔记---文本的CSS规则和盒模型;div与span;<a>元素的链接色;伪类
1.每个font-family包含一组共同特征的字体.共五个字体系列: sans-serif----这个系列包括了没有衬线的字体,与serif相比,通常认为这个系列更容易在计算机上识读. serif- ...
随机推荐
- ASP.NET中XML转JSON的方法
原文:ASP.NET中XML转JSON的方法 许多应用程序都将数据存储为XML的格式,而且会将数据以JSON的格式发送到客户端以做进一步处理.要实现这一点,它们必须将XML格式转换为JSON格式. X ...
- datagridcolumn单元格怎么显示查询到的某个表的字段值(字段值可能为多个)
例如,在之前做的项目中,查询mhz_xckcr表,select出某个业务的现场勘察人信息,select出的现场勘察人姓名(可能有多个)要在前台datagrid的一个datagridcolmn单元格显示 ...
- 在SQL Server 2008中调用.net,dll
原文:在SQL Server 2008中调用.net,dll T-SQL的在执行普通的查询的时候是很高效的,但是在执行循环,判断这样的语句的时候效率就不那么的高了.这时可以借助CLR了,我们可以在SQ ...
- 开启apache服务
安装后如果需要手动添加Sevice,可以按照如下方法: Apache版本:httpd-2.2.15_win32 Apache Service Monitor 提示:“No services insta ...
- 【分享】Python学习资源大合集
地址:http://www.hejizhan.com/html/xueke/520/x520_03.html Python安装软件合集(Windows)(78) Python教程——游戏编程(13) ...
- 实践中总结——理解haslayout和BFC
1.HASLAYOUT 首先,haslayout翻译成中文就是:有布局. 所谓布局,指的是一个元素可以对本身和里边的元素进行尺寸计算和定位.这里只是谈IE6/7,据说微软之所以不是对所有元素默认有布局 ...
- 认知的SSH
认知的SSH 实习了三个月,对着SSH有着一定的认识了,就以自已认识的大概思路写一篇文章吧,留给以后的自已,也恳请各位博友们如果看到我的认识有过错的地方能帮我指正过来! 在写正文之前,先说说我这段时间 ...
- 64位下Hook NtOpenProcess的实现进程保护 + 源码 (升级篇 )
64位下Hook NtOpenProcess的实现进程保护 + 源码 (升级篇 ) [PS: 如果在64位系统下,出现调用测试demo,返回false的情况下,请修改Hook Dll的代码] glhH ...
- 使用C++做算法时,对内存的管理的办法
使用C++做算法时,对内存的管理的办法 最近老是在想C++的内存控制机制,查了一些资料所以有点想法,自己记录一下免得以后自己忘了. 1. 需求 在做线性代数的算法时,首要的就实现Matrix这个类.由 ...
- Mahout之(三)相似性度量
User CF 和 Item CF 都依赖于相似度的计算,因为只有通过衡量用户之间或物品之间的相似度,才能找到用户的“邻居”,才能完成推荐.上文简单的介绍了相似性的计算,但不完全,下面就对常用的相似度 ...