Bagaimana untuk mengalih keluar padding di sekeliling widget dalam sempadan?
P粉187160883
P粉187160883 2023-09-07 12:54:25
0
1
649

Gambar pertama adalah apa yang saya ada, gambar kedua adalah apa yang saya ingin capai.

Setakat ini saya menyedari bahawa melumpuhkan kedua-dua tanda kutu (dalam gambar di atas) menyelesaikan masalah, tetapi bagaimanakah saya menulis kod css?

Ini adalah kod yang saya gunakan pada masa ini untuk melaraskan widget mengikut keinginan saya.

span[data-pin-log="pinterest"] {
    overflow: scroll;
    overflow-x: hidden;
}
span[data-pin-log="embed_grid"]::-webkit-scrollbar {
    width: 0;  /* Remove scrollbar space */
    background: transparent;  /* Optional: just make scrollbar invisible */
}
/* Optional: show position indicator in red */
span[data-pin-log="embed_grid"]::-webkit-scrollbar-thumb {
    background: #FF0000;
}

#pinterest [class$=_button] {
  display: none !important;
}
#pinterest [class$=_button] {
  display: none !important;
}
#pinterest [class$=_hd] {
display: none !important;
}
body > span[data-pin-log="embed_grid"] {
  border: none;
}
<a data-pin-do="embedBoard" data-pin-board-width="350" data-pin-scale-height="500" data-pin-scale-width="130" href="https://www.pinterest.co.uk/toastedmacarons/rich-boys-city-girls/"></a>
<script async defer src="https://assets.pinterest.com/js/pinit.js"></script>

Jika ia membantu, widget ini ada di sini.

Pengetahuan saya tentang CSS sangat terhad jadi sebarang bantuan amat dihargai. Terima kasih terlebih dahulu :))

P粉187160883
P粉187160883

membalas semua(1)
P粉665427988

Ikuti kod CSS saya:

/* Remove scrollbar */
body > span[data-pin-log="embed_grid"] > span[data-pin-log="embed_grid"] {
    overflow: scroll;
    overflow-x: hidden;
}
body > span[data-pin-log="embed_grid"] > span[data-pin-log="embed_grid"]::-webkit-scrollbar {
    width: 0;  /* Remove scrollbar space */
}

/* Remove border */
body > span[data-pin-log="embed_grid"] {
  border: none;
  padding: 0 !important;
}

/* Remove padding */
body > span[data-pin-log="embed_grid"] > span[data-pin-log="embed_grid"] {
  padding: 0;
}

/* Hide header (pinterest logo) */
body > span[data-pin-log="embed_grid"] > span[data-pin-log="embed_grid"]:first-child {
  display: none;
}

/* Hide follow button */
body > span[data-pin-log="embed_grid"] > span[data-pin-log="embed_user_ft"]:last-child {
  display: none;
}

Contoh penuh di Codepen

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan