老师,检查一下,怎么让文字段落的长度和图片一样

老师,检查一下,怎么让文字段落的长度和图片一样

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

<title>CSS布局</title>

<style type="text/css">

/*此处写代码*/

*{margin:0 auto;padding: 0;}

.main{width: 1000px;overflow: hidden;}

h2{margin:10px 0;text-align: center;}

.dec{float: left;margin: 10px;}

img{width: 480px;height: 320px;}

.desc{}


</style>

</head>

<body>

<!-- 此处写代码 -->

<div class="main">

<h2>ENJOY THE LIFE</h2>

<div class="dec">

<img class="img1" src="http://img1.sycdn.imooc.com/climg//58f829090001a4b504260240.jpg">

<div class="desc"> Life si like a book,just read more and more<br> 

refined,more write more carefully. When read,<br>mind open,all 

things have been indifferent to<br> heart.Life is the precipitation.

</div>

</div>

<div class="dec">

<img class="img2" src="http://img1.sycdn.imooc.com/climg//58f8290f0001558804260240.jpg">

<div class="desc"> Life is like a cup of tea,let people lead a<br>

person to endless aftertastes.You again good<br>

taste.it will always have a different taste<br>

more</div>

</div>



</div>

</body>

</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕言 2019-09-29 09:55:17

同学你好,如果要实现文字段落的长度和图片一样,那么建议:去掉br标签,给类名为desc的元素设置宽度,并且值和图片的宽度值一致。

代码参考:
http://img1.sycdn.imooc.com//climg/5d900ed609e475bd11490738.jpg


http://img1.sycdn.imooc.com//climg/5d900ef109acb9d003050108.jpg

其他地方实现的是可以的,继续加油,祝学习愉快~

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师