HTML 结构标签(div+span)
一、div 标签
div 就是 division 的缩写 分割, 分区的意思
常见的用途是文档布局。
二、span 标签
span, 跨度,跨距;范围
<span> 元素可用于为部分文本设置样式属性
三、分类
根据每个标签的特性和属性不同又可以分为行元素,块元素,行块元素。
1、块元素
块元素主要是 <div> 为首的元素,如 h 系列的标签,p 元素,ul,ol,li 等元素
特点:
- 默认与父类同宽度
- 高度由内容撑开
- 独占父亲一行
- 默认与父类同宽度
2、行元素
行元素是以 <span> 元素为首的标签,如 <strong>标签,a 标签等
特点:
- 宽度由内容决定,不支持宽高设置
- 同行显示,换行有间隙
- 宽度由内容决定,不支持宽高设置
3、行块元素
行块元素同时具有行元素、块元素的特点,如 img 标签等。
更多的标签学习请参考这里:http://www.w3school.com.cn/html/index.asp
HTML 结构标签(div+span)的更多相关文章
- HTML基础之HTML标签-html header(meta,title) html body(p,br,h,form,div,span,input,lable)
摘自:http://www.imdsx.cn/index.php/2017/07/27/html0/ 一.HTML标签 <!DOCTYPE html> <!--标准的html规则,类 ...
- 10-2 body标签中相关的标签(字体标签,排版标签(div,span),超链接,图片标签)
一 排版标签(div,span) 1块级标签 <!--div:把标签中的内容作为一个块儿来对待(division).必须单独占据一行.--> <!--div标签的属性:--> ...
- HTML中的Div Span label的区别
div与span 大家在初学div+css布局时,有很多困惑,在div与span的使用过程没觉得有一定的”章法”,觉得两个区别不大,在w3c的关于div和span的定义:div作为分割文档结构自然使它 ...
- HTML5-新增语义化结构标签
总结目录结构: 1.简洁的DOCTYPE声明 2.新的布局结构标签 header,article,section,aside,footer 3.新的其它常用标签: nav,hgroup,figure, ...
- div/span等获取焦点问题(tabindex属性的简单理解)
1.先看问题 当我们要对一个div/span元素获取焦点的时候,直接对$("#div1").focus()是不能实现效果的,比如下图: 当点击输入框进行输入后,在点击区域弹出选择地 ...
- HTML5新增结构标签
引言 在本节中,笔者将向大家讲述三部分内容,分别介绍HTML5时代的召唤,跟HTML4的区别,以及HTML5中带来的新的结构标签. HTML5时代的召唤 HTML4与HTML5的区别 HTML5新结构 ...
- img标签与span一起使用不在同一条线上
布局时 img标签与span标签在同一行是不能垂直,解决办法:在 img标签添加一个 vertical-align:middle; 即 <!-- img与span的文字与图片保持同一条水平线 在 ...
- 前端 HTML body标签相关内容 常用标签 盒子标签 div
盒子标签 div <div>可定义文档的分区 division的缩写 译:区 <div> 标签可以把文档分割为独立的.将他们进行分区 div在浏览器中,默认是不会增加任何的效果 ...
- HTML5的新结构标签
在之前的HTML页面中,大家基本上都是用了Div+CSS的布局方式.而搜索引擎去抓取页面的内容的时候,它只能猜测你的某个Div内的内容是文章内容容器,或者是导航模块的容器,或者是作者介绍的容器等等.也 ...
- html5新结构标签
html5新结构标签 <header> 定义 section 或 page 的页眉,也就是定义头部的标签. <footer> 定义 section 或 page 的页脚. & ...
随机推荐
- vue中异步请求渲染问题(swiper不轮播)(在开发过程中遇到过什么问题、踩过的坑)
问题描述: 用vue封装一个swiper组件的时候,发现轮播图不能轮播了. 原因: 异步请求的时间远大于生命周期执行的时间,mounted初始化DOM时数据未返回,渲染数据是空数组,导致轮播图的容器层 ...
- vb.net 对字符串中的括号匹配进行判断,容许嵌套
' 括号检查 ' 括号共有四种: 1(英文圆括号),2(中文圆括号),3[方括号],4{花括号} ' 要左右匹配(可以嵌套) Private Shared Function i ...
- UA记录
安卓QQ内置浏览器UA: Mozilla/5.0 (Linux; Android 5.0; SM-N9100 Build/LRX21V) AppleWebKit/537.36 (KHTML, like ...
- 基于web公交查询系统---站点信息管理
界面设计: 界面设计代码获取: 搭建好框架获取信息: 核心代码: var users = [ ];//获取到的bus所有站点信息 var rowIndex = -1; $.ajax({ url: &q ...
- 《Linux就该这么学》培训笔记_ch07_RAID和LVM
<Linux就该这么学>培训笔记_ch07_RAID和LVM 文章最后会post上书本的笔记照片. 文章主要内容: RAID(独立冗余磁盘阵列) 部署磁盘阵列 损坏磁盘阵列及修复 磁盘阵列 ...
- Centos修改swap分区大小
1. 查看当前分区情况 free -m 2. 增加swap大小 dd if=/dev/zero of=/var/swap bs=1024 count=12288000 #增加12G空间 3. 设置交换 ...
- [转帖]Linux firewalld 防火墙使用
Linux firewalld 防火墙使用 2018-06-19 19:26:08 蚩尤后裔 阅读数 2101 收藏 更多 分类专栏: Linux 版权声明:本文为博主原创文章,遵循CC 4.0 ...
- 在RedisTemplate中使用scan代替keys指令
keys * 这个命令千万别在生产环境乱用.特别是数据庞大的情况下.因为Keys会引发Redis锁,并且增加Redis的CPU占用.很多公司的运维都是禁止了这个命令的 当需要扫描key,匹配出自己需要 ...
- Spring Boot 嵌入式 Tomcat 文件上传、url 映射虚拟路径
1.Java web 应用开发完成后如果是导入外置的 Tomcat 的 webapps 目录的话,那么上传的文件可以直接的放在应用的 web 目录下去就好了,浏览器可以很方便的进行访问. 2.Spri ...
- C/C++ 的编译和链接
C/C++文件 C/C++程序文件包括 .h .c .hpp .cpp,其中源文件(.c .cpp)是基本的编译单元,头文件(.h .hpp)不会被编译器编译. C/C++项目构建(build)过程, ...