首页 > 解决方案 > 如何在使用 clear:both 的图像下添加行间距

问题描述

我在图像后遇到行距问题。基本上如果你看下面的截图,你可以看到它就在图片5. Work Hard, Play Hard6. Motivation正下方。

我想在下面创建一个行空间,但这很奇怪,因为我必须<br/><br/>在下5. Work Hard, Play Hard<br/><br/><br/>下做6. Motivation

我不喜欢这样做,所以想了解添加中断的最佳方法?

在此处输入图像描述

代码:

<img src="img/friendships.png" height="200" width="250" alt="Metis Skills and Careers Build Friendships" style="float: left; margin: 3px 12px 3px 0px; border: 1px solid #000000;">
            
            <p>Building relationships, as with any industry, is a great part of the charm and IT is no exception. Like-minded people with similar zest for knowledge makes it even more exciting to perform well at your job. </p>
            
            <p>Mayur, being in the IT sector for 10+ years, says -</p>
            
            <p><i>“This is one of my favourite ones. I have built friendships with colleagues I have worked with over the years and I know you will too. You will have plenty of opportunities.”&lt;/i></p>
            
            <p style="clear: both;"><b>5. Work Hard, Play Hard</b></p>
            
            <img src="img/play-hard.png" height="200" width="250" alt="Metis Skills and Careers Build Friendships" style="float: left; margin: 3px 12px 3px 0px; border: 1px solid #000000;">
            
            <p>IT provides a lot of social activities during and after work including board games, video games, after work drinks, hackathons, meals, attending tech events and other things they can think of. 
            It’s your choice how much you want to socialise or not, but it’s great to have that option.</p>
            
            <p style="clear: both;"><b>6. Motivation</b></p>
            
            <p>Creating new tech, working on cool features, learning new skills, socialising with friends, all of these provide you motivation. 
            It’s a creative sector with plenty of opportunities to learn and continue to push yourself because there’s so much interest and a vast amount of knowledge to explore. 
            Working in IT is a natural motivator.</p>

标签: htmlcss

解决方案



在您正在执行的段落中添加一个clear:both

<p style="clear: both;"><br/><b>5. Work Hard, Play Hard</b></p>

...

<p style="clear: both;"><br/><b>6. Motivation</b></p>

推荐阅读