美文网首页
CSS基础-元素分类

CSS基础-元素分类

作者: 傻小子不会起名字 | 来源:发表于2015-12-08 09:45 被阅读0次

块级元素(block)

特点

1、每个块级元素都从新的一行开始,并且其后的元素也另起一行(霸道吧,一个块级元素独占一行)

2、块级元素的高度,宽度,行高以及顶和底边距都可以设置

3、块级元素在不设置宽度的时候,是其本身父容器的100%(和父元素宽度一致),除非自己设置宽度

那么,问题来了,我想成为霸道的块级元素怎么办呢?

<div><p><h1><form><ul><li>等就是块级元素

设置display:block就是将元素显示为块级元素


内联元素(行内元素)(inline)

先问个问题,内联元素是个什么鬼?

在HTML中,<span><em><strong><a><label>就是典型的内联元素

块级元素也可以通过设置display:inline成为内联元素

呵呵呵呵,据我猜测,接下来该说特点了吧!

O__O "…如你所愿:

1、和其他元素都在一行上;

2、元素的高度、宽度及顶部和底部边距不可设置;

3、元素的宽度就是它包含的文字或图片的宽度,不可改变。


内联块状元素(inline-block)

别说话,让我猜猜:

这货应该就是内联元素和块状元素的结合体,哈哈哈哈

。。。先把特点奉上:

1、和其他元素都在一行上;

2、元素的高度、宽度、行高以及顶和底边距都可设置。

凸(艹皿艹 ),我觉得这货牛,我要去见见他们:

代码display:inline-block就是将元素设置为内联块状元素

<img><input>就是内联块状元素标签

相关文章

  • CSS基础-元素分类

    块级元素(block) 特点 1、每个块级元素都从新的一行开始,并且其后的元素也另起一行(霸道吧,一个块级元素独占...

  • HTML/CSS 06-元素类型

    css元素类型的分类,css 元素类型的转换,css float,css inline-block元素类型的应用 ...

  • 慕课网笔记5 css 盒模型 布局

    慕课网: HTML+CSS基础课程 一、元素分类 在讲解CSS布局之前,我们需要提前知道一些知识,在CSS中,ht...

  • CSS元素分类

    在了解CSS布局之前,我们需要提前知道一些知识,在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素...

  • Css元素分类

    HTML中的标签元素大体被分为三种不同的类型:块状元素,内联元素,内联块状元素。 常用块状元素: ....

  • css 元素分类

    块级元素 内联元素(行内) 内联块级元素 块级元素 等display:block inline 内联原素 内联块级元素

  • CSS元素分类

    在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素、内联元素(又叫行内元素)和内联块状元素。 元素...

  • CSS元素分类

    阿里云服务器3折开售(点此直达) CSS元素分类 块级元素常用的块级元素有: 、 - ...

  • CSS元素分类

    块状元素 行内元素 行内快元素 元素特点: 块状元素: 在页面中以矩形区域显示。 自上而下排列,独占一行 可以直接...

  • css元素的分类以及盒子模型

    css元素的分类以及盒子模型 html标签元素的分类 块状元素常见的块状元素有: ... ...

网友评论

      本文标题:CSS基础-元素分类

      本文链接:https://www.haomeiwen.com/subject/preehttx.html