< p >頭像并排的排列在網頁設計中是一種常見的布局。利用CSS的特性，可以輕松實現(xiàn)頭像并排排列。以下是一些示例代碼，供參考:< pre >.avatar-box { display: flex; justify-content: center; } .avatar { width: 100px; height: 100px; margin: 0 10px; }< p >上述代碼將頭像容器設為 flex 布局，并在容器內部設置每個頭像的樣式。通過 margin 屬性設置頭像之間的間距。此外，還可以使用 grid、float 等方式實現(xiàn)頭像并排排列。< pre >.avatar-box { display: grid; grid-template-columns: repeat(3, 100px); grid-gap: 10px; } .avatar { width: 100px; height: 100px; }< p >以上代碼使用 grid 布局將容器分成三列，并利用 repeat() 函數(shù)設置每列的寬度。使用 grid-gap 屬性設置頭像之間的間距。< pre >.avatar-box { overflow: hidden; } .avatar { float: left; width: 100px; height: 100px; margin-right: 10px; }< p >最后，通過將容器的 overflow 屬性設為 hidden，再使用 float 屬性將頭像浮動到左側，實現(xiàn)頭像并排排列。通過設置 margin 屬性控制頭像之間的間距。