Computer >> 컴퓨터 >  >> 프로그램 작성 >> CSS

CSS로 단어를 기준으로 줄 바꿈


word-break 속성을 사용하여 CSS로 단어를 기준으로 줄을 바꿈. CSS에서 단어 나누기 속성을 구현하기 위해 다음 코드를 실행할 수 있습니다 -

예시

<html>
   <head>
      <style>
         p.text1 {
            width: 140px;
            border: 1px solid #000000;
            word-break: keep-all;
         }
         p.text2 {
            width: 140px;
            border: 1px solid #000000;
            word-break: break-all;
         }
      </style>
   </head>
   <body>
      <b>line break at hyphens:</b>
      <p class = "text1">Tutorials Point originated from the idea that there exists a class of
      readers who respond better to online content and prefer to learn new skills at
      their own pace from the comforts of their drawing rooms.</p>
      <b>line break at any character</b>
     
      <p class = "text2">Tutorials Point originated from the idea that there exists a class of
      readers who respond better to online content and prefer to learn new skills at their
      own pace from the comforts of their drawing rooms.</p>
   </body>
</html>

출력

CSS로 단어를 기준으로 줄 바꿈