Ako pridať tlačidlá 3D CSS do Weebly?

Pridanie tlačidiel 3D CSS vo Weebly zahŕňa niekoľko krokov prispôsobenia kódu v rámci vlastnej sekcie CSS. Takto ich môžete pridať na svoj web Weebly:

Krok 1:Vytvorte vlastný štýl CSS

a. V editore Weebly kliknite na „Nastavenia“ v pravom hornom rohu.

b. V ľavom menu vyberte "SEO &Code".

c. Kliknite na kartu „Vlastné CSS“.

d. Prilepte nasledujúci kód do poľa Custom CSS:

```

.button-3d {

displej:inline-block;

výplň:10px 20px;

farba pozadia:#000;

farba:#fff;

text-align:center;

text-dekorácia:žiadna;

text-transform:veľké písmená;

font-weight:bold;

orámovanie:2px pevné #fff;

}

.button-3d:active {

transformácia:mierka(0,9);

farba pozadia:#333;

farba okraja:#333;

}

```

Krok 2:Úprava štýlu tlačidla

a. V kóde si môžete zvoliť úpravu rôznych možností štýlu tlačidiel.

- Ak chcete prispôsobiť vzhľad, upravte položky „odsadenie“, „farba pozadia“, „farba“ a „hmotnosť písma“.

- Zmenou `border-color` nastavte farbu orámovania okolo tlačidla.

b. Nebojte sa experimentovať s vlastnosťami CSS, aby ste dosiahli požadovaný vzhľad tlačidiel.

Krok 3:Pridajte tlačidlo na svoju stránku

a. Vo svojom editore Weebly pridajte prvok Text na požadované miesto na stránke.

b. Kliknite na záložku "HTML" v nastaveniach textového prvku.

c. Pridajte nasledujúci kód HTML a nahraďte „Váš text“ textom, ktorý chcete zobraziť na tlačidle:

```html

Váš text

```

Krok 4:Úprava umiestnenia tlačidla

a. Polohu a štýl tlačidla môžete upraviť pomocou nastavení prvku Text.

b. Zvážte použitie možností zarovnania na vycentrovanie alebo plávanie tlačidla podľa potreby.

Krok 5:Uložiť a publikovať

a. Keď budete spokojní so vzhľadom a umiestnením tlačidla, kliknite na „Uložiť“, aby ste zmeny použili.

b. Pozrite si ukážku zmien na svojom webe.

c. Keď budete pripravení, kliknite na „Publikovať“, aby sa tlačidlo aktivovalo na vašom webe.

Podľa týchto krokov môžete jednoducho pridať tlačidlá 3D CSS na zlepšenie používateľského zážitku a estetiky vašej webovej lokality Weebly.

• Predchádzajúca strana: Ako pridať strúhanku na web Weebly? 
• Ďalšia strana: Ako pridať efekt vznášania sa perspektívneho obrázka do Weebly?