位置特性分类元素分为三类:块级元素,行内元素,行级块元素

1.块级元素(block)

       特点: (1)可以设置宽高、内、外边距;
                (2)独占一行(即前后均有换行);
                (3)块级元素如果不设置宽度和高度,则宽度默认为父级元素的宽度。高度则根据内容大小自动填充。
      常见的块级元素: div、p、h1、h2......hn,ol、ul、dl、li、form、table
         
2.行级元素(inline)
      特点: (1)不可设置宽高、上下内、外边距。(左右内、外边距设置有效)
                  (2)其宽度和高度由其内容自动填充。
                  (3)其他行级元素共处一行 
     常见的行级元素:a、span、i、lable等
 
 3.行内块元素(inline-block)
      特点:(1)可以设置宽高、内外边距;
                 (2)可以与其他行内元素、内联元素共处一行;
     常见的内联元素:input、img
 
=================元素之间的转化========================
display:block;(将元素变为块级元素)
display:inline;  (将元素变为行级元素)
display:inline-block;(将元素变为行级块元素)
 
 
(可以在行内样式或css样式中改变元素的display将三种元素进行转换)

HTML元素类别及转换的更多相关文章

  1. 获取元素的xpath, 转换xpath为csspath进行jQuery元素获取

    获取元素的xpath, 转换xpath为csspath进行jQuery元素获取 博客分类: 编程心得 jQueryCSSHTML  var $shadow = new Object(); /** 获取 ...

  2. Revit API过滤元素类别(FamilySymbol与FamilyInstance)

    仅OfCategory()过滤的元素包含系统FamilySymbolOfClass(typeof(FamilyInstance))过滤出来文档中族实例. ;         ;         ;   ...

  3. 浅析HTML的元素类型及其转换

    大家都知道html是由标签元素组成的,在了解元素的类型转换之前,让我们先来了解一下html的元素类型. 一.html元素类型分为两种:块级元素和内联元素,内联元素又被称为行内元素.  常见的块级元素有 ...

  4. html5--4-4 audio元素/格式的转换

    html5--4-4 audio元素/格式的转换 学习要点 掌握audio元素的用法 视频/音频文件的格式转换 当前,audio 元素支持三种音频格式: Ogg 免费, 支持的浏览器:Firefox. ...

  5. CSS的元素显示模式与转换

    CSS的元素显示模式与转换 1. CSS的元素显示模式 1.1 块元素 <div>标签是最典型的块元素.另外常见的块元素有h1~h6.p.ul.ol.li等. 特点: 独占一行 高度.宽度 ...

  6. 一、python基本语法元素(温度转换)

    #C=(F-32)/1.8 ; F = C * 1.8 + 32 TempStr = input("请输入带有符号的温度值:") if TempStr[-1] in ['f','F ...

  7. html行级元素和块级元素以及css转换

    之前有说过html的标签是有语义的,当然也就有一些默认的样式,比如标题有h1···h6,他们的字体由大至小一次递减,字体比一般字体要加粗. 这样也就有了行级元素和块级元素,下面来看看什么是行级元素什么 ...

  8. 内联元素于与块元素的转换 相对定位、绝对定位以及fixed定位 Z轴覆盖

    今天上午学习了内联元素于与块元素的转换     个人觉的display:none将元素非常好用,可以配合当鼠标放到这里会出现. 转换成行内元素display: inline;  转换成块元素displ ...

  9. [Web 前端] 016 css 元素的转换

    三种元素之间的转换 display 属性是用来设置元素的类型及隐藏的 常用的属性有 none 元素隐藏且不占位置 block 元素以块元素显示 inline 元素以内联元素显示 inline-bloc ...

随机推荐

  1. Java之所有输入流输出流的分类

    (1)字节输入流        基类:InputStream        FileInputStream.ByteArrayInputStream.PipedInputStream.Buffered ...

  2. golang中的context包

    标准库的context包 从设计角度上来讲, golang的context包提供了一种父routine对子routine的管理功能. 我的这种理解虽然和网上各种文章中讲的不太一样, 但我认为基本上还是 ...

  3. C#.NET 大型通用信息化系统集成快速开发平台 4.1 版本 - 树形选择项目的标准例子

    用成套的现成的方法引导大家开发程序,整个团队的开发效率会很高.例如我们现在有30多个开发人员,若有300个开发人员,这开发工作很容易乱套,我们需要有效的管理维护所有团队的开发工作.把数据结构.通用的组 ...

  4. vue prop 传递数据

    prop 组件实例的作用域是孤立的.这意味着不能 (也不应该) 在子组件的模板内直接引用父组件的数据.要让子组件使用父组件的数据,需要通过子组件的 props 选项 一个组件默认可以拥有任意数量的 p ...

  5. Nginx 通过 Lua + Redis 实现动态封禁 IP

    一.背景 为了封禁某些爬虫或者恶意用户对服务器的请求,我们需要建立一个动态的 IP 黑名单.对于黑名单之内的 IP ,拒绝提供服务. 二.架构 实现 IP 黑名单的功能有很多途径: 1.在操作系统层面 ...

  6. Python学习第十一篇——for 的本质及如何正确修改列表

    假如现在有一个列表:magicians_list = ['mole','jack','lucy'],现在想通过一个函数来实现,在列表的每个元素前面加上“the Great”的字样.现在通过一个函数来实 ...

  7. elasticsearch聚合操作——本质就是针对搜索后的结果使用桶bucket(允许嵌套)进行group by,统计下分组结果,包括min/max/avg

    分析 Elasticsearch有一个功能叫做聚合(aggregations),它允许你在数据上生成复杂的分析统计.它很像SQL中的GROUP BY但是功能更强大. 举个例子,让我们找到所有职员中最大 ...

  8. Oracle可视化工具PL/SQL Developer的安装与配置

    安装程序: 安装目录不能有中文和空格,否则无法进行远程连接. 推荐使用 D:\PLSQLDeveloper 为安装目录 破解PLSQLDeveloper 使用工具 PLSQL Developer10. ...

  9. vagrant的centos镜像,怎么用root用户登录?

    vagrant的centos镜像,默认用户和密码都是vagrant,如果要用root用户登录,应该怎么办呢? 百度了一下,有一篇博客是这样说的: 默认的登录用户是vagrant,如果想实现默认root ...

  10. 免费苹果账号(apple id)申请ios证书p12真机调试

    HBuilder可以直接打包越狱版的ipa包,但需要越狱手机才能安装,如果需要安装到没越狱的手机安装,需要自己申请ios证书打包. 一般是需要一个付费了的苹果开发者账号才能申请ios证书打包. 这里介 ...