1 HTML 区块元素: 大多数 HTML 元素被定义为块级元素内联元素

1.1 块级元素实例: <div> <h1>, <p>, <ul>, <table>

块级元素的特点: 独占一行,可设置宽高

1.2 行级元素实例 :<span> <a>

行级元素特点:一行可排布多个,不可设置宽高.

1.3 行内块元素:使用的最多:<input> <img>

  行级元素特点:一行可排布多个,也可设置宽高.

2 常用标签行内块特性区别介绍:

2.1 HTML<div> 元素的常见的用途是文档布局。它取代了使用表格定义布局的老式方法。是定义了文档的区域,块级 (block-level)

使用 <table> 元素进行文档布局不是表格的正确用法。<table> 元素的作用是显示表格化的数据。

2.2 HTML <span> 元素是内联元素,可用作文本的容器

<span> 元素也没有特定的含义。是用来组合文档中的行内元素, 内联元素(inline)

当与 CSS 一同使用时,<span> 元素可用于为部分文本设置样式属性。

css总结17:HTML块级元素&行内元素之分: <div> 和<span>的更多相关文章

  1. css盒模型和块级、行内元素深入理解

    盒模型是CSS的核心知识点之一,它指定元素如何显示以及如何相互交互.页面上的每个元素都被看成一个矩形框,这个框由元素的内容.内边距.边框和外边距组成,需要了解的朋友可以深入参考下 一.CSS盒模型 盒 ...

  2. css盒子模型的深入理解,在块级、行内元素的区别和特性

    css盒子模型用于处理元素的内容.内边距.边框和外边距的方式简称.元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景.内边距的边缘是边框.边框以外是外边距,外边距默认是透明的 ...

  3. 3、第3课CSS块级、行内元素、绝对定位、相对定位、固定位置20150922

    1.块级元素 A:特点: A.1默认显示在父标签的左上角 A.2块级元素默认占满一行(占满整个文档流) B:常见的块级元素 P   h1--h6   ul  li    ol  li   div  h ...

  4. day001-html知识点总结(-)块级。行内元素区分

    -.行内元素和块级元素的区别与转换: 区别: 1.从形式上看,在标准文档流中,行内元素会水平方向呈线性排列,而块级元素会各占一行,垂着方向排列. 2.在结构使用上,块级元素可以包含行内元素和块级元素, ...

  5. block与inline,inline和inline-block,块级和行内元素,行内替换和行内非替换元素

    block:块级元素默认display属性为block:无论块内内容有多少,总是占满一行: inline:行内元素默认display属性为inline:只占据块内的内容的大小,不会占满一整行: inl ...

  6. 元素显示模式:块元素 & 行内元素 & 行内块元素

    元素显示模式 前言 了解元素的显示模式可以更好的让我们布局页面.了解显示模式需要学习以下三个方面 什么是元素的显示模式 元素显示模式的分类 元素显示模式的转换 什么是元素显示模式 元素显示模式就是元素 ...

  7. css菜鸟学习之text-align属性,行内元素,块级元素居中详解

    一.text-align属性 1.text-align用来设置元素中的的文本对齐方式,例如:如果需要设置图片的对齐方式,需要设置图片的父元素的text-align属性: 2.text-align只对文 ...

  8. 块级元素行内元素以及display属性

    1.什么叫做标签语义化? ->合理的标签做合适的事情 ->HTML中常用的标签都有哪些? (块状标签和行内标签) ->块状标签和行内标签的区别? (常用的有8条区别) 1)内联元素: ...

  9. HTML 块级元素 行内元素

    块级元素 - block level element 总是在新行上开始: 高度,行高以及外边距和内边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度: 它可以容纳内联元素和其他块元素 如: ...

随机推荐

  1. BZOJ2084:[POI2010]Antisymmetry

    浅谈\(Manacher\):https://www.cnblogs.com/AKMer/p/10431603.html 题目传送门:https://lydsy.com/JudgeOnline/pro ...

  2. git 统计命令

    git log --author='user' --pretty=tformat: --numstat --since='2018-01-01' --before='2018-10-10' | gaw ...

  3. TXT

    ANDRIOD: 192.168.199.119 data50803360 zc_3floor kk4836kk kahuna  kk1626kk

  4. 小程序WXML基本使用

    数据绑定 <!--wxml--> <view> {{message}} </view> // page.js Page({ data: { message: 'He ...

  5. python's twenty-fifth day for me 模块

    模块: py文件就是模块. python之所以好用,因为模块多. 内置模块:python安装的时候自带的. 扩展模块:别人写好的,需要安装后可直接使用. 自定义模块:自己写的模块. 序列化模块: 能存 ...

  6. http响应chunked格式分析

    有的时候服务器生成HTTP回应是无法确定信息大小的,这时用Content-Length就无法事先写入长度,而需要实时生成消息长度,这时服务器一般采用Chunked编码. 在进行Chunked编码传输时 ...

  7. Java面向对象-对象的多态性

    Java面向对象-对象的多态性 Java中的多态性表现: 1,方法的重载和重写(覆盖): 2,可以用父类的引用指向子类的具体实现,而且可以随时更换为其他子类的具体实现: 我们先搞个父类Animal: ...

  8. Android 4.4 外置卡

    虾米.酷狗.百度地图.UC浏览器 下载 可以设置下载路径保存到外置SD卡上. 其他的软件目前还不支持. 最终Android 4.2是可以选择的,后来Android禁用了外置卡,以上软件是如何实现的?

  9. MySQL的FORMAT函数用法规则

    1.FORMAT函数在mysql中是数据内容格式化的,格式化后得到结果:###,###,#####. ,); 输出结果: ,000.00 2.可以格式化数据为整数或者浮点数. ); 输出结果: 100 ...

  10. Elasticsearch聚合限制内存使用

    限制内存使用 通常为了让聚合(或者任何需要访问字段值的请求)能够快点,访问fielddata一定会快点, 这就是为什么加载到内存的原因.但是加载太多的数据到内存会导致垃圾回收(gc)缓慢, 因为JVM ...