为了账号安全,请及时绑定邮箱和手机立即绑定

我将块状元素转成内联块状元素,然而有些内联块状元素却不会在同一行。


<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>流动模式下的块状元素</title>

<style type="text/css">

#box1{

    width:300px;

    height:100px;

}

div,h1,p{display:inline-block;

    border:1px solid red;

}

</style>

</head>

<body>

    <div id="box2">box2</div><!--块状元素,由于没有设置宽度,宽度默认显示为100%--> 

    <h1>标题</h1><!--块状元素,由于没有设置宽度,宽度默认显示为100%--> 

    <p>文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段文本段。</p><!--块状元素,由于没有设置宽度,宽度默认显示为100%--> 

    

    <div id="box1">box1</div><!--块状元素,由于设置了width:300px,宽度显示为300px-->

</body>

</html>

正在回答

3 回答

只是因为运行后的页面太小了放不下,放在在VS code里面写就是一行的了。

0 回复 有任何疑惑可以回复我~

#box2的宽度问题?

0 回复 有任何疑惑可以回复我~
#1

望持 提问者

不,就是单纯的,为什么标题和文本以及box1不在同一个水平上,他们都是内联块状,包含内联都在同一水平上的特点,所以我就有点纳闷,你知道为什么吗?
2020-03-04 回复 有任何疑惑可以回复我~

http://img1.sycdn.imooc.com//5e5db9540001159b07960600.jpg

这是运行结果

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

我将块状元素转成内联块状元素,然而有些内联块状元素却不会在同一行。

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信