HTML元素分为：块状元素和内联元素

块元素:(block)

1.默认独占一行

2.没有宽度时，默认撑满一排

3.可以定义元素的宽和高

常见的块状元素有div，ul，li，h1-h6，ol

内联,行内元(inline)

1.多个内联元素可以同一行显示

2.高和宽由内容撑开

3.不支持宽高

4.不支持上下的margin值

常见的内联元素有：a，br，strong，em，span，

在这两张元素之外还有，img，input，等被称为行内块元素

他们区别一般inline元素

如img/input/select/button等有内在尺寸且可以设置width/height属性的这类元素

上面说了html的元素类型，现在说一下怎么把元素转换

display属性和属性值

display有十八个属性，我们说一下它常用的几个

display：block/inline/inline-block/none/list-item

display:block:块状显示，使类型变为块状元素

display：inline内联显示，使类型变为内联元素

display:inline-block行内元素显示

（1）元素的内容以块状显示，并且与其它元素显示在一行

（2）支持宽高，没有宽度的时候由内容撑开

（3）只要这一个元素类型支持vertical-align（img,input）

display：none：将元素隐藏，不会显示，并不占空间

display：list-item：将元素转成列表，li的默认display类型，当元素设置了float属性后，

就相当于给元素加了，display：block，且宽度为撑出来的内容

HTML元素类型和类型的转换的更多相关文章

  1. 将泛类型集合List类转换成DataTable

    /// <summary> /// 将泛类型集合List类转换成DataTable /// </summary> /// <param name="list&q ...

  2. springMVC注解@initbinder日期类型的属性自动转换

    在实际操作中经常会碰到表单中的日期 字符串和Javabean中的日期类型的属性自动转换, 而springMVC默认不支持这个格式的转换,所以必须要手动配置, 自定义数据类型的绑定才能实现这个功能. 一 ...

  3. 分享：根据svg节点对象类型和路径值转换坐标值

    功能用处: 对svg文件的路径节点填充时会使用(相邻两个坐标区域内的四边形的填充颜色不重复). 需要对svg文件中的Path节点或者 Polyline 节点做颜色填充.并且相邻的两个区域之间的颜色不允 ...

  4. HTML 表单元素、 输入类型、Input 属性

    <input> 元素 最重要的表单元素是 <input> 元素. <input> 元素根据不同的 type 属性,可以变化为多种形态. 注释:下一章讲解所有 HTM ...

  5. #定义一个方法get_num(num),num参数是列表类型，判断列表里面的元素为数字类型。其他类型则报错，并且返回一个偶数列表：（注：列表里面的元素为偶数）。

    #定义一个方法get_num(num),num参数是列表类型,判断列表里面的元素为数字类型.其他类型则报错,并且返回一个偶数列表:(注:列表里面的元素为偶数). def get_num(num): i ...

  6. python字典转化成json格式。JSONEncoder和JSONDecoder两个类来实现Json字符串和dict类型数据的互相转换

    遇到问题:进行Webservice接口测试时,对接口入参数据进行了处理,变成了dict格式,去进行接口请求报错. 需要转成成json格式,双引号去扩. 如下: 更改代码: # 在Python标准库的j ...

  7. 算法：用两个栈来实现一个队列，完成队列的Push和Pop操作。 队列中的元素为int类型。

    算法:用两个栈来实现一个队列,完成队列的Push和Pop操作. 队列中的元素为int类型.<剑指offer> 利用栈来进行操作,代码注释写的比较清楚:首先判断两个栈是否是空的:其次当栈二 ...

  8. Java 日期时间 Date类型,long类型,String类型表现形式的转换

    Java 日期时间 Date类型,long类型,String类型表现形式的转换 1.java.util.Date类型转换成long类型 java.util.Date dt = new Date(); ...

  9. mfc 类型间的强制转换

    一. static_cast运算符 用法:static_cast < type-id > ( expression ) 该运算符把expression 转换为type-id类型,但没有运行 ...

  10. 转换成json字符串,与json字符串转换成java类型都要先转换成json对象

    转换成json字符串,与json字符串转换成java类型都要先转换成json对象

随机推荐

  1. 吴裕雄 Bootstrap 前端框架开发——Bootstrap 图片

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. C++面试常见问题——12虚函数

    虚函数 虚函数的工作原理 虚函数的实现要求对象携带额外的信息,这些信息用于确定运行时调用哪一个虚函数,这一信息具有一种被称为虚函数表指针(vptr)的指针形式.vptr指向一个被称为虚函数表(vtbl ...

  3. nuxt.js 初始化 npm run dev 报错

    在初始化 npm install 了基本依赖后: npm run dev 报错: error in ./server/index.js Module build failed: Error: Plug ...

  4. Program-Language

    1. 主流编程语言 2. 编程语言分类     2.1 编译or解释     2.2 按照客观系统的描述可分为两类     2.3 按照编程范型可分为 3. 语言范式 Paradigm 4. 计算机语 ...

  5. xcode windows版安装使用教程

    随着iPhone.iPad.Mac等苹果产品越来越火爆,越来越多的初学者想要了解和尝试苹果平台,包括苹果操作系统Mac OS X.苹果演示软件Keynote.苹果开发工具Xcode等.然而,苹果电脑价 ...

  6. 前端解析返回的对象时json显示$ref问题的解决

    在mapper中写的语句,结果集中association,采用的一个对象,整个list列表中每个元素有一个对象元素,如果第二个元素中有一个与第一个元素中对象同名的,就会去引用上一个元素的地址,在jso ...

  7. NRF52840与NRF52832的性能区别

    蓝牙版本的不断更新,大部分客户慢慢都向往着蓝牙5.0.当然对于前不久NORDIC刚出的蓝牙5.0 NRF52840,很多人都还不是很了解.NRF52840可以说是NRF52832的超强升级版,虽然同样 ...

  8. Fedora-19安装texlive2013并配置中文

    参考博文:  http://blog.csdn.net/longerzone/article/details/8129124 之前通过yum install安装了texlive,不过在使用过程中老是报 ...

  9. shell中取字符串子串的几种方式 截取substr

    shell中取字符串子串的几种方式 echo "123456789" | awk '{print substr($0,5,2)}' 截取 1)awk中函数substrsubstr( ...

  10. excel提取数字

    部分提取,那么就用=-LOOKUP(,-MID(A1,MIN(FIND({0;1;2;3;4;5;6;7;8;9},A1&1234567890)),ROW($1:$1024))) ------ ...