显示方式
程序员文章站
2023-11-18 10:50:16
08.05自我总结 一.显示方式 1.display 常用的三种方式 2.vertical align 文本垂直对齐方式: |` top bottom` ......
08.05自我总结
一.显示方式
1.display
常用的三种方式
#第一种block 1.支持设置宽高 2.自带换行 一般情况所有有宽高、参与位置布局的都是block #第二种inline 1.不支持设置宽高,宽高只能有文本撑开 2.不带换行,一行显示不下会自动换行(保留数据的整体性) 一般情况存放文本的 #第三种inline-block 1.支持设置宽高 2.不带换行,一行显示不下会自动换行(以标签整体换行,标签左右有间距) 一般情况不去主动设置该显示方式,系统的两个img、input都设置为了单标签(不会嵌套任何东西) 注:如果要用inline-block参与布局,为了标签布局不受内容影响,设置vertical-align: top,上对齐
2.vertical-align
文本垂直对齐方式:baseline
|top
|bottom