静态补充CSS类型转换

块级元素

常用的块级block标签:
<hn>...</hn>  标题标签
<hr> 水平分割线
<p>...</p>  段落
<ul>...</ul>  无序列表
<ol>...</ol>  有序列表
<dl>...</dl>  定义列表
<table>...</table>  表格
<form>...</form>  表单
<div>...</div>布局标签

块级特性
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
**行内元素
**

常用的内联/行内inline标签:
<span>...</span>
<a>...</a>  链接
<br>  换行(空标签,不深究)
<b>...</b>  加粗、倾斜、下划线、删除线等文本装饰标签
<select>...</select>  下拉列表

行内元素特性
行内/内联特性
在这里插入图片描述
在这里插入图片描述在这里插入图片描述在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

常用的行内块级inline-block标签:
<img />图片标签
<input>输入框
<textarea>文本域/多行输入框
<td>单元格
<select>下拉框
<button>按钮

行内/内联特性
在这里插入图片描述
元素模式转换
display属性用于元素转换

通过以上发现->内联元素无法直接设置宽高、对块级元素设置宽高才可以奏效。
如果想使元素类型/模式转换,则可以使用display进行转换
在这里插入图片描述
元素特性
常用元素特性
(1)block块级元素
块级元素特性:自动换行,可以直接设置宽高
(2)inline内联/行内元素
不换行,无法设置宽高
(3)inline-block 行内块级元素
既拥有行内元素特性,又有块级元素特性。不换行且可以直接设置宽高。
(4)none隐藏元素
设置为none后则会隐藏元素,在页面彻底蒸发

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值