랜딩 페이지를 만들고 있는데, 처음에는 웹 줄바꿈에 맞춰서
<br>
태그로 줄바꿈을 해주었다.
<p>
Lorem Ipsum is simply<br/>
dummy text</span> of the printing and
</p>
<br>
태그를 사용한 줄바꿈은 모바일 화면에 맞춰 줄바꿈을 변경하는 것이 어렵다는 문제가 있었다.
span
태그를 이용하면 이러한 문제를 해결할 수 있었다.
줄바꿈하고 싶은 부분을 span
태그로 감싸고,
css에서 display: block;
을 적용하면 줄바꿈이 된다.
<p>
<span>Lorem Ipsum is simply</span>
<span>dummy text</span> of the printing and
</p>
span {
display: block;
}