前端学习_04.内联/块级元素
来源:互联网 发布:楼月软件 编辑:程序博客网 时间:2024/06/05 15:02
块级元素
- a)特点
i.所有块级元素占用全部宽度,不能和其他元素共享一行。
ii.可以根据盒模型特性设置宽高内外间距,如果不设置宽度,则默认填充父级元素的宽度。
iii.内部可以继续容纳其他元素。包括:div、dl、h系列、hr、ul、li、ol、table、p等
iv.包括:div、dl、h系列、hr、ul、li、ol、table、p等
内联元素
- a)特点
i.所有内联元素只占用必要的宽度,默认和其他元素在同一行。
ii.不遵循盒模型特性设置,宽高只和内容有关。
iii.内部可以继续容纳其他元素。
iv.元素包括:文本标签(a、b、u、font、span )、input、label、textarea、img、select等。
块级和内联相互转换
- a)块级元素->内联元素
增加css属性display:inline - b)内联元素->块级元素:
增加css属性display:block - c)既是内联元素又是块级元素:(既希望元素具有宽度高度特性,又具有同行特性)
增加css属性inline-block
i.每一行所有的inline-block元素会共同形成一个line box
ii.line box的高度由里面最高的元素决定,不会与下一行的列表元素发生错位
正确使用 Display的属性
- a)display: block后不应该再使用vertical-align
- b)display: inline后不应该再使用width、height、margin、padding以及float
- c)display: inline-block后不应该再使用float
阅读全文
0 0
- 前端学习_04.内联/块级元素
- 块级元素、内联元素学习笔记
- WEB前端 -- 块元素与内联元素
- 块级元素、内联元素、可变元素
- css块级内联元素
- 前端的一些概念剖析---文档流、内联元素和块级元素
- 【WEB前端】3.CSS内联元素和块元素
- 块级元素和内联元素
- 内联元素和块级元素
- CSS块级元素与内联元素
- 块级元素与内联元素
- 什么是块级元素和内联元素?
- CSS块级元素、内联元素概念
- 块级元素和内联元素
- CSS块级元素、内联元素概念
- CSS块级元素、内联元素概念
- CSS块级元素、内联元素概念
- 内联元素和块级元素
- pyspark RDD 自定义排序(python)
- JDBC、JdbcTemplate、SpringData对比学习
- 显式锁(二)--- Lock接口与显示锁
- [Leetcode][python]Binary Tree Maximum Path Sum
- 21. Merge Two Sorted Lists
- 前端学习_04.内联/块级元素
- SpringCloud简单入门——写给自己
- [Unity 热更新]tolua集成
- Python 代码运行时间的3种计算方法
- netcat
- 经典编程书籍大全
- Spring-Cloud-Config 共享公共配置
- nginx配置负载均衡
- 编写DAO(Data Access Object)