Bolehkah saya Susun Imej Boleh Diklik dalam Bulatan Menggunakan CSS?

Letakkan Ikon ke dalam Bulatan

Soalan: Boleh beberapa elemen diletakkan dalam bulatan di sekeliling yang lain dan adakah elemen tersebut menjadi pautan boleh klik?

Jawapan:

Ya, ini boleh dilakukan menggunakan CSS. Berikut ialah dua penyelesaian:

Penyelesaian Moden (2024)

1. Mulakan dengan tatasusunan imej dengan URL dan teks alt.
2. Jana HTML menggunakan Pug atau mana-mana yang lain kaedah untuk membuat pautan dengan imej.
3. Tetapkan saiz bekas berdasarkan bilangan imej dan imej saiz.
4. Letakkan imej pada bulatan menggunakan perubahan CSS.

Penyelesaian Warisan (Dipelihara Atas Sebab Sejarah)

1. Buat pembungkus dengan kedudukan: saudara; dan tetapkan diameternya.
2. Letakkan pautan dengan imej di tengah-tengah pembalut menggunakan kedudukan: mutlak;.
3. Tetapkan sudut untuk setiap imej dan gunakan transformasi CSS berantai:

.deg{desired_angle} {
   transform: rotate({desired_angle}) translate(12em) rotate(-{desired_angle});
}

Nota: Penyelesaian moden adalah fleksibel dan membolehkan untuk menambah imej baharu tanpa mengubah struktur semasa.

Atas ialah kandungan terperinci Bolehkah saya Susun Imej Boleh Diklik dalam Bulatan Menggunakan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!