css总结17:HTML块级元素&行内元素之分: <div> 和<span>
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>的更多相关文章
- css盒模型和块级、行内元素深入理解
盒模型是CSS的核心知识点之一,它指定元素如何显示以及如何相互交互.页面上的每个元素都被看成一个矩形框,这个框由元素的内容.内边距.边框和外边距组成,需要了解的朋友可以深入参考下 一.CSS盒模型 盒 ...
- css盒子模型的深入理解,在块级、行内元素的区别和特性
css盒子模型用于处理元素的内容.内边距.边框和外边距的方式简称.元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景.内边距的边缘是边框.边框以外是外边距,外边距默认是透明的 ...
- 3、第3课CSS块级、行内元素、绝对定位、相对定位、固定位置20150922
1.块级元素 A:特点: A.1默认显示在父标签的左上角 A.2块级元素默认占满一行(占满整个文档流) B:常见的块级元素 P h1--h6 ul li ol li div h ...
- day001-html知识点总结(-)块级。行内元素区分
-.行内元素和块级元素的区别与转换: 区别: 1.从形式上看,在标准文档流中,行内元素会水平方向呈线性排列,而块级元素会各占一行,垂着方向排列. 2.在结构使用上,块级元素可以包含行内元素和块级元素, ...
- block与inline,inline和inline-block,块级和行内元素,行内替换和行内非替换元素
block:块级元素默认display属性为block:无论块内内容有多少,总是占满一行: inline:行内元素默认display属性为inline:只占据块内的内容的大小,不会占满一整行: inl ...
- 元素显示模式:块元素 & 行内元素 & 行内块元素
元素显示模式 前言 了解元素的显示模式可以更好的让我们布局页面.了解显示模式需要学习以下三个方面 什么是元素的显示模式 元素显示模式的分类 元素显示模式的转换 什么是元素显示模式 元素显示模式就是元素 ...
- css菜鸟学习之text-align属性,行内元素,块级元素居中详解
一.text-align属性 1.text-align用来设置元素中的的文本对齐方式,例如:如果需要设置图片的对齐方式,需要设置图片的父元素的text-align属性: 2.text-align只对文 ...
- 块级元素行内元素以及display属性
1.什么叫做标签语义化? ->合理的标签做合适的事情 ->HTML中常用的标签都有哪些? (块状标签和行内标签) ->块状标签和行内标签的区别? (常用的有8条区别) 1)内联元素: ...
- HTML 块级元素 行内元素
块级元素 - block level element 总是在新行上开始: 高度,行高以及外边距和内边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度: 它可以容纳内联元素和其他块元素 如: ...
随机推荐
- EL and JSTL(Jsp Standard Tag Libary)(转)
一.什么是 EL 语言. 表达式语言(EL)是 JSP 2.0 引入的一种计算和输出 Java 对象的简单语音. 二.EL 语言的作用. 为了使JSP写起来更加简单.表达式语言的灵感来自于 ECMAS ...
- 手把手使用 Webpack 4 建立 VUE 项目
手把手使用 Webpack 4 建立 VUE 项目 安装 node.js 略 安装 cnpm 略 安装 webpack cnpm install webpack -g 安装 vue-cli cnpm ...
- ubuntu下安装ros出现“无法下载-package.ros.org中某个包-校验和不符”的解决方法
新安装的Ubuntu14.04,为了科研马上准备装ros indigo,却困难重重,一步一个坎. 比如说按照ros wiki里面一步一步来,当运行sudoapt-get update 然后出现下列情况 ...
- (转)使用PowerDesigner生成HTML功能
本文转载自:http://www.cnblogs.com/CowboyProgrammer/archive/2009/04/28/1445423.html 使用PowerDesigner设计数据库关系 ...
- java代码实现点击鼠标从控制台输出信息
总结:最难的就是当我们需要点击按钮时去实现某个功能-----------因为那个我没有理解透,是涉及整个程序的 package com.a.b; import javax.swing.*; impor ...
- MySQL的Innodb缓存相关优化
MySQL的Innodb缓存相关优化 INNODB 状态的部分解释 通过 命令 SHOW STATUS LIKE 'Innodb_buffer_pool_%' 查看 Innodb缓存使用率 (I ...
- MFC学习(七) 单文档程序
1 MFC单文档程序的主要类 (1)文档类(Document) 即应用程序处理的数据对象,文档一般从 MFC 中 CDocument 中派生.CDocument 类用于相应数据文件的读取以及存储 Cv ...
- JavaScript笔记——DOM的操作
节点及其类型 在JavaScript中,节点分为三种: 元素节点:HTML标签元素. 属性节点: 元素的属性, 可以直接通过属性的方式来操作. 文本节点: 是元素节点的子节点, 其内容为文本. 在什么 ...
- Angular2快速入门-1.创建第一个app
一.环境搭建 Angular2 运行在nodejs 环境下,需要我们先创建好nodejs环境,具体操作 1.下载安装Nodejs,参考网址,https://nodejs.org/en/ 选择64位 ...
- Node.js的原型继承函数util.inherits
util.inherits(constructor, superConstructor)是一个实现对象间原型继承 的函数.JavaScript 的面向对象特性是基于原型的,与常见的基于类的不同.Jav ...