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. ncdu 查找linux下最占空间的文件(交互式查询)

    安装 wget -c https://dev.yorhel.nl/download/ncdu-1.11.tar.gz tar xzvf ncdu-1.11.tar.gz cd ncdu-1.11 ./ ...

  2. Java 引用类型变量的声明和使用

    引用类型变量的声明和使用 (1)把类名当作是一种类型来声明变量,这种变量叫引用类型变量.如:People people; (2)引用类型变量保存对象的“引用”,即对象的地址. (3)对象的创建 new ...

  3. php时间 显示刚刚 几分钟前等

    功能示例: $now = time();foreach($sys_res as $k => $v){ $day = intval(floor(($now - $v->system_time ...

  4. mongo数据排序和分页显示

    数据排序 使用sort()1 升序-1 降序自然排序 数据插入的顺序$natural db.stu.drop(); db.stu.insert({,,"address":" ...

  5. POJ2226(最小顶点覆盖)

    Muddy Fields Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 10044   Accepted: 3743 Des ...

  6. Effective java笔记3--类和接口2

    三.接口优于抽象类 java提供两种机制,可以用来定义一个允许多个实现的类型:接口和抽象类.由于java只允许单继承,所以,抽象类作为类型定义受到了极大的限制. 已有的类可以很容易被更新,以实现新的接 ...

  7. 1139 First Contact

    题意:给出n个人,m对朋友关系,其中带负号的表示女孩.然后给出k对查询a,b,要求找出所有a的同性别好友c,以及b的同性别好友d,且c和d又是好友关系.输出所有满足条件的c和d,按c的升序输出,若c编 ...

  8. php代码中临时开启错误调试

    对php.ini 中参数的设置 也可用在php代码中完成. 调用:调用ini_set()函数 //开启php.ini中的display_errors指令 ini_set('display_errors ...

  9. oracle 11g r2 rac到单实例的dg

    oracle 11g r2 rac到单实例的dg 1 主备环境说明 rac环境--primary CentOS release 6.5 (Final)hostname rac1 rac2ip 10.* ...

  10. Rest之路 - 介绍篇

    What is REST ? REST 是 REpresentational State Transfer 的缩写.是一种基于HTTP协议来进行进行数据交换的web标准框架.她的思想是:视组件为资源. ...