HTML中块元素与内联元素的概念

div就是一个块元素，所谓的块元素就是会独占一行的的元素,无论他的内容有多少，他都会独占一整行。

p h1 h2 h3 ...

div这个标签没有任何语义，就是一个纯粹的块元素，并且不会为它里边的元素设置任何的默认样式，

div元素主要用来对页面进行布局的

span是一个内联元素（行内元素）

所谓的行内元素，指的是只占自身大小的元素，不会占用一行

常见的内联元素：a img iframe span

span没有任何的语义，span标签专门用来选中文字，然后为文字来设置样式

块元素主要用来做页面中的布局，内联元素主要用来选中文本设置样式，一般情况下只使用块元素去包含内联元素，而不会使用内联元素去包含一个块元素

a元素可以包含任意元素，除了他本身

p元素不可以包含任何块元素

另：

html “title”属性，这个属性可以给任何标签指定

当鼠标移入到元素上时，元素中的title属性的值将会作为提示文字显示

HTML中块元素与内联元素的概念的更多相关文章

  1. （转） html块级元素和内联元素区别详解

    http://blog.csdn.net/chen_zw/article/details/8713205 块级元素(block)特性: 总是独占一行,表现为另起一行开始,而且其后的元素也必须另起一行显 ...

  2. html块级元素和内联元素区别详解

    块级元素(block)特性: 总是独占一行,表现为另起一行开始,而且其后的元素也必须另起一行显示; 宽度(width).高度(height).内边距(padding)和外边距(margin)都可控制; ...

  3. 4-21 嵌套选择器 、块级元素和内联元素、光标、布局-overflow

    1.嵌套选择器 p{ }: 为所有 p 元素指定一个样式.(默认,,也就是说可以被改变样式) .marked{ }: 为所有 class="marked" 的元素指定一个样式. . ...

  4. html中的块元素和内联元素的区别

    一.定义 块元素一般都从新行开始,它可以容纳内联元素和其他块元素,可设置高度.宽度和边距等. 内联元素一般都是基于语义级的基本元素,它只能容纳文本或其他内联元素,主要特点是:和其他元素位于同一行上,高 ...

  5. css中块级元素、内联元素（行内元素、内嵌元素）

    Block element 块级元素    顾名思义就是以块显示的元素,高度宽度都是可以设置的.比如我们常用 的<div>.<p>.<ul>默认状态下都是属于块级元 ...

  6. 浅谈HTML中的块级元素和内联元素

    一.基本概念 1.块级元素(block element):一般都从新行开始占据一定的矩形空间,可以设置其宽.高属性来改变矩形的大小.一般情况下块级元素可以包含内联元素和其它块级元素,但也有特殊如for ...

  7. CSS中的块级元素、内联元素（行内元素）

    Block element 块级元素    顾名思义就是以块显示的元素,高度宽度都是可以设置的.比如我们常用 的<div>.<p>.<ul>默认状态下都是属于块级元 ...

  8. margin在块元素、内联元素中的区别 padding

    (1)margin在块元素.内联元素中的区别 HTML(这里说的是html标准,而不是xhtml)里分两种基本元素,即block和inline.顾名思义,block元素就是以”块”表现的元素(bloc ...

  9. Css中的两个重要概念：块状元素和内联元素

    一.display:block display:block就是将元素显示为块级元素,一般是其他元素的容器,可容纳内联元素和其他块状元素,块状元素排斥其他元素与其位于同一行,宽度(width)高度(he ...

随机推荐

  1. javascript模块化编程 从入门到实战

    <!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="UTF-8& ...

  2. RabbitMQ的介绍及使用进阶（Docker+.Net Core）

    目录: 一.什么是RabbitMQ 二.RabbitMQ运用场景 三.RabbitMQ优势及特点 四.Centos7中Docker安装RabbitMQ 五..Net Core 中使用RabbitMQ ...

  3. 初探机器学习之使用讯飞TTS服务实现在线语音合成

    最近在调研使用各个云平台提供的AI服务,有个语音合成的需求因此就使用了一下科大讯飞的TTS服务,也用.NET Core写了一个小示例,下面就是这个小示例及其相关背景知识的介绍. 一.什么是语音合成(T ...

  4. 开发小白也毫无压力的hexo静态博客建站全攻略 - 躺坑后亲诉心路历程

    目录 基本原理 方法1 - 本机Windows下建站 (力荐) 下载安装node.js 用管理员权限打开命令行,安装hexo-cli和hexo 下载安装git 初始化hexo 使用hexo gener ...

  5. 前端笔记之NodeJS（三）Express&ejs模板引擎&请求识别

    一.Express框架 1.1基本使用 创建http服务器特别麻烦,express框架解决了这个的问题. Express在node界的地位,就相当于jQuery在DOM界的地位.jQuery的核心就是 ...

  6. JS点击图片更改照片

    <img src="../../img/20190224185111.png" alt="" id="zhaopian"/> - ...

  7. c# 事件的订阅发布Demo

    delegate void del(); class MyClass1 { public event del eventcount;//创建事件并发布 public void Count() { ; ...

  8. jqgrid postData post方式累加参数，缓存了原来的数据

    今天做项目的时候发现一个问题,我们有一个筛选项,一个是VIP用户,一个是普通用户,还有一个是全部用户,首先看下我们的selection <select name="" id= ...

  9. NFS的搭建及配置

    [root@centos199 conf]# rpm -q nfs-utils rpcbind #查看这两个包是否安装,如未安装则用yum安装nfs-utils-1.2.3-39.el6.x86_64 ...

  10. 3.Git基础-查看当前文件状态、跟踪新文件、暂存文件、忽略文件、提交更新、移除文件、移动文件

    1.检查当前文件状态 --  git status  git diff  git diff --staged   git status :我们可以使用 git status 来查看文件所处的状态.当运 ...