在CSS中,文字和圖片并列排布是一種常見的網(wǎng)頁布局方式,可以有效地提高頁面的可讀性和美感。
下面是一段示例代碼:
/* 定義一個包含文字和圖片的塊級元素 */ .container { display: flex; align-items: center; } /* 定義文字樣式 */ .text { font-size: 24px; color: #333; margin-right: 20px; /* 防止文字和圖片之間過于靠近 */ } /* 定義圖片樣式 */ .image { width: 200px; border-radius: 50%; /* 在此例中,圖片為圓形 */ }
接下來,在HTML中實現(xiàn)這個布局:
這里是一些文字描述
通過以上代碼,我們可以看到文字和圖片之間實現(xiàn)了并排排布,且圖片被設置為圓形,整個布局效果非常美觀、清晰。