bst365最新正规买球

网站建设-前端CSS块元素与内联元素详解
  • 更新时间:2024-07-19 00:20:17
  • 网站建设
  • 发布时间:1年前
  • 289

在css盒模型中我们提到了html元素中的块元素和内联元素。那么它们到底是什么?

块元素一般是其他元素的容器元素,可以容纳其他块元素或行内元素。常见的有P标签和DIV标签。块元素就像一个四方形,可以容纳其他四方形元素,可以出现在页面的任意位置。

right: 0px; margin-top: 0px; orphans: 2; outline-color: invert; outline-style: none; outline-width: 0px; padding-bottom: 5px; padding-left: 0px; padding-right: 0px; padding-top: 5px; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;">      我们用div标签举个例子,给div标签设置一个"宽高各200px 背景颜色红色“的样式,得到一个宽高各200px的方块,如下图:

      试着再添加一个div标签,加入margin-bottom下边距,区分他们的位置,接下来把宽度去掉,可以看到宽度变宽了,从浏览器的左边到右边,现在有两个红色块逐行显示仿佛表现的很霸道,如下图:

      由此得知块元素的特性:

          1.在没有设置宽度的情况下默认撑满一行
              2. 默认块元素不在一行
              3.支持所有CSS命令

      内联元素也叫内嵌元素或行内元素,内联元素只能容纳文本或者其他内联元素,常见内联元素有a和span。

      用span标签为例,添加三个span标签,设置”宽高200px 背景颜色红色 margin10px“样式, 发现并没有按200*200去展示 ,margin标签对上下并没有改变,对比块元素由此得知:

      内联元素的特性:

           1.宽高由内容撑开

               2.不支持宽高

               3.一行上可以继续显示跟同类的标签

               4.不支持margin的上下特性

               5.代码换行被解析

 本文章来源推来客:网站建设

我们专注高端建站,小程序开发、软件系统定制开发、BUG修复、物联网开发、各类API接口对接开发等。十余年开发经验,每一个项目承诺做到满意为止,多一次对比,一定让您多一份收获!

本文章出于推来客官网,转载请表明原文地址://www.tlkjt.com/web/11609.html

扫码联系客服

3985758

回到顶部