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- ...
随机推荐
- ZA7783：MIPI转LVDS/MIPI转RGB888/RGB转LVDS
在消费类电子越来越白热化阶段.好多设计project师已经開始慢慢关注到成本控制,小金在这里就给大家带来一颗转接IC.希望能帮助贵公司控制成本.当然性能也是可靠的,已经好多产品设计了. 多多不吝赐教 ...
- 按照鬼哥学so变化，四，第一章的例子
跟随鬼哥伦比亚科学so变化,四.第一章的例子 图纸/文化 听鬼哥说故事 ---------------------------------------------切割线--------------- ...
- beanutils中jdbc
public class JDBCTest { // public static void main(String[] args) throws Exception {// Cla ...
- 深入剖析Provider Model
Membership三步曲之进阶篇 - 深入剖析Provider Model Membership 三步曲之进阶篇 - 深入剖析Provider Model 本文的目标是让每一个人都知道Provide ...
- DLL文件的引用
首先我们先要写一个DLL文件: 我先创建一个win32的DLL工程,在工程中添加了Math.h和Math.cpp文件,具体内容如下: Math.h: #pragma once #include &qu ...
- 通用性站点管理后台(Bee OPOA Platform)
当前标签: Bee OPOA Platform 通用性站点管理后台(Bee OPOA Platform) (5)- [扩展]基于WebSocket的监视Sql执行功能 蜂 2013-10-25 1 ...
- Microsoft Message Analyzer （微软消息分析器，“网络抓包工具 - Network Monitor”的替代品）官方正式版现已发布
Microsoft Message Analyzer (微软消息分析器,“网络抓包工具 - Network Monitor”的替代品)官方正式版现已发布 来自官方日志的喜悦 被誉为全新开始的消息分析器 ...
- mac下安装eclipse以及python
因为前几天刚重装了我的mac osx 系统,从昨天开始我就在安装各种软件,当我安装好破解版的myeclipse后,在我安装pydev插件的时候,虽然现实成功但是在preference中死活找不到pyd ...
- LigerUI权限系统之用户管理
用户管理较之前的的组织结构和菜单管理稍显复杂.不管怎样还是先上图吧,再来讲解 左边是组织结构,右边是用户,用户是跟组织机构挂钩的,通过点击左边的组织结构,来刷新右边,加载该组织机构下的用户. 用户管理 ...
- haskell学习笔记<1>--基本语法
七月记录:整个七月就在玩,参加夏令营,去遨游.... 八月份需要开始复习,正等书的这个过程突然想起一直没有完成的学习-haskell,所以当前的目标是用haskell制作一个局域网通信的小工具,要求: ...