IT story

p 태그로 새 줄을 피하는 방법은 무엇입니까?

hot-time 2020. 9. 8. 21:59
반응형

p 태그로 새 줄을 피하는 방법은 무엇입니까?


<p>태그로 작업하는 동안 같은 줄을 유지하려면 어떻게 해야합니까?


display: inlineCSS 속성을 사용합니다 .

이상적 : 스타일 시트에서 :

#container p { display: inline }

나쁜 / 극단적 인 상황 : 인라인 :

<p style="display:inline">...</p>

<p>단락 태그는 텍스트의 단락을 지정하기위한 것입니다. 텍스트가 새 줄로 시작하지 않도록하려면 <p>태그를 잘못 사용하는 것이 좋습니다 . 아마도 <span>태그가 당신이 달성하고자하는 것에 더 가깝게 맞을 것입니다 ...?


나는 CSS를 위해 이것을 보았습니다.

span, p{overflow:hidden; white-space: nowrap;}

유사한 stackoverflow 질문을 통해


다음과 같이 :

p
{
    display:inline;
}

스타일 시트에서 모든 p 태그에 대해 수행합니다.


Flexbox가 작동합니다.

.box{
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-content: center;
  align-items:center;
  border:1px solid #e3f2fd;
}
.item{
  flex: 1 1 auto;
  border:1px solid #ffebee;
}
<div class="box">
  <p class="item">A</p>
  <p class="item">B</p>
  <p class="item">C</p>
</div>

참고 URL : https://stackoverflow.com/questions/2076109/how-to-avoid-a-new-line-with-p-tag

반응형