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- ...
随机推荐
- 成C++应用程序世界------异常处理
一. 概述 C++自身有着很强的纠错能力,发展到现在,已经建立了比較完好的异常处理机制.C++的异常情况无非两种,一种是语法错误,即程序中出现了错误的语句,函数,结构和类,致使编译程序无法进行.还有一 ...
- ODBC操作数据库
/*ODBC使用步骤:(ODBC数据源由微软平台提供) * 1.配置ODBC数据源(控制面板->管理工具->ODBC数据源) * 2.加载并注册驱动程序,导入java.sql.*包 * 3 ...
- queue，指针求最短路的区别
这里以spfa为例://都用邻接表存边: 指针: int h=1,t=1; q[h]=x; while(h<=t){ int u=q[h]; vis[u]=0; for(int i=head[u ...
- Orchard中的Host和Tenant
Orchard的多个子站点特性 Orchard中可以支持多个子站点.当你运行Orchard的时候,通常一个网站运行在一个应用程序域中.这也是一般ASP.NET应用程序区分两个网站的方法,也就是说两 ...
- Power Designer导出实体类和NHibernate xml文件
Power Designer导出实体类和NHibernate xml文件 今天研究了一下通过PowerDesigner生成实体类和NHibernate所需要的xml文件,方法是通过Power Desi ...
- TFS二次开发的数据统计以PBI、Bug、Sprint等为例（一）
TFS二次开发的数据统计以PBI.Bug.Sprint等为例(一) 在TFS二次开发中,我们可能会根据某一些情况对各个项目的PBI.BUG等工作项进行统计.在本文中将大略讲解如果进行这些数据统计. 一 ...
- [原]调试没有符号的 iOS 应用
说明: 这里的调试是指使用 lldb 远程调试 iOS 应用 设置断点是指在 ObjC 方法上设置断点 使用场景: 1.调试被 strip 了的 iOS 应用 2.调试被 strip 了的 iOS 系 ...
- 对中级 Linux 用户有用的 20 个命令
也许你已经发现第一篇文章非常的有用,这篇文章是继对初级Linux用户非常有用的20个命令的一个延伸. 第一篇文章的目的是为新手准备的而这篇文章则是为了Linux的中高级用户.在这里你将学会如何进行自定 ...
- ios开发实践之UIDatePicker（已对之前无法解决的问题做了解答）
需求:要做一个生日选择的控件,但除了选择之外还需要自定义几个控件,跟生日选择控件组合一起. 做法:自定义了一个UIImageView,并且作为背景.在这个背景view上再添加其他button和时间选择 ...
- mac osx 10.9安装配置macvim
如果你已经安装了macvim,升级后又不能用了,建议你可以看看http://kodira.de/2013/10/macvim-osx-10-9-mavericks/这篇文章,如果你还没有安装,下面由我 ...