📜  CSS 中的“word-break:break-all”与“word-wrap:break-word”有什么区别?

📅  最后修改于: 2022-05-13 01:56:42.712000             🧑  作者: Mango

CSS 中的“word-break:break-all”与“word-wrap:break-word”有什么区别?

CSS 中的 word-break 属性用于指定单词在到达行尾时应如何断开或拆分。 word-wrap 属性用于拆分/打断长单词并将它们换行到下一行。

“word-break: break-all;”之间的区别和“自动换行:断词;”

  • 断词:打破一切;它用于在任何字符处分词以防止溢出。
  • word-wrap:断词;它用于在任意点断开单词以防止溢出。

“断词:打破一切;”将在任何字符处分词,因此导致阅读困难,而“word-wrap: break-word;”将拆分单词而不使单词不会在中间中断并将其包装到下一行。

示例 1:此示例显示全部属性值。

 
 
     
         
     
     
        
              

GeeksforGeeks

              

word-break: break-all;

              

GeeksforGeeksGeeksGeeks. A              computer science portal for geeks .

          
         

输出:

示例 2:此示例显示断词属性值。

 
 
     
         
     
     
        
              

GeeksforGeeks

              

word-break: break-word

              

GeeksforGeeksGeeksGeeks.A              computer science portal for geeks .

          
         

输出:

示例 3:此示例显示了 break-all 和 break-word 属性值的比较。



      

      
    
    

  

    
        

GeeksforGeeks

                   
                           
                

word-break: break-all:

                                   
                    Prepare for the Recruitment drive of product                     based companies like Microsoft, Amazon, Adobe                     etc with a free online placement preparation                     course. The course focuses on various MCQ's                     & Coding question likely to be asked in the                     interviews & make your upcoming placement                     season efficient and successful.                 
            
                           
                

word-wrap: break-word:

                                   
                    Prepare for the Recruitment drive of product                     based companies like Microsoft, Amazon, Adobe                     etc with a free online placement preparation                     course. The course focuses on various MCQ's                     & Coding question likely to be asked in the                     interviews & make your upcoming placement                     season efficient and successful.                 
            
        
    
                       

输出: