CSS可以實現文字環繞圖片效果,這對于網站排版有很大的幫助。以下是實現文字環繞圖片的代碼:
img{ float: left; margin-right: 10px; /* 圖片與文字間距 */ } p{ text-align: justify; /* 文字對齊方式 */ text-justify: inter-ideograph; /* 兩端對齊中文 */ }
代碼中,我們對圖片使用了float屬性,將其設置為向左浮動,使得文字排版時能夠避開它。同時,我們為圖片設置了右側的margin,使得圖片和文字之間有一定的距離。
對于段落文字,我們使用text-align屬性來設置對齊方式為justified(兩端對齊),并且使用text-justify屬性來保證中英文混排的情況下,中文也能夠實現兩端對齊的效果。