Prispôsobte si časť Hlavička blogu Blogger.com

Smieť 3, 2024

V poslednom tutoriále sme prispôsobili časť Odkazy pre váš Blogger^TM weblog. Teraz upravíme časť Hlavička v hornej časti blogu. Hlavička obsahuje názov a popis vášho blogu. Chystáme zmeniť písmo alebo písmo textu a pridať farebné pozadie.

Rovnako ako v poslednom tutoriále vykonáme tieto vylepšenia zmenou niekoľkých riadkov kódu HTML šablóny. Kliknite na kartu Šablóna v ponuke v hornej časti stránky, čím sa dostanete do časti Upraviť aktuálnu šablónu. HTML kód šablóny nájdete v rámčeku nižšie. Urobíme niekoľko zmien v kóde štýlu CSS. (Ak sa chcete dozvedieť viac o kaskádových štýloch, kliknite na odkaz nižšie.) Posúvajte kód nadol, kým sa nedostanete k časti Hlavička v rámci štýlu CSS. Ako vidíte, značka štýlu je veľmi dlhá a časť Hlavička značky štýlu má šesť častí.

@media all
@media vreckový počítač
#názov blogu
# blog-title a
# blog-title a: hover
#description

Prvá časť kódu (@ všetky) riadi vlastnosti hlavičky vrátane šírky, okraja a veľkosti okrajov. Druhá časť (handheld @media) dedí tieto vlastnosti z prvej časti a tiež zmení šírku hlavičky na 90 percent pre ručné monitory. Pretože chceme, aby sa nová farba pozadia používala v obidvoch prípadoch, pridáme do prvej časti riadok kódu pre farbu pozadia (@media all). Tento nový riadok kódu je uvedený tučným písmom nižšie. V nižšie uvedenom príklade sme použili svetlošedú farbu, ale môžete kedykoľvek použiť ľubovoľnú farbu.

@media all {
#header {
farba pozadia: # EFE3EF;
...
Ďalej zmeníme písmo názvu na populárne, neformálne písmo s názvom Comic Sans MS. Môžete samozrejme používať ľubovoľné písmo, ktoré sa vám páči. Nasledujúce tri časti kódu CSS šablóny (# blog-title, # blog-title a, # blog-title a: hover) kontrolujú charakteristiky nadpisu blogu. Prvá časť riadi všeobecné charakteristiky a ďalšie dve časti kontrolujú vzhľad textu, keď funguje ako hypertextový odkaz. Ak chcete nastaviť písmo alebo písmo názvu pre všetky prípady, pridáme kód CSS rodiny fontov do prvej časti (# blog-title). Pretože náš názov písma obsahuje medzery, bude tiež potrebné umiestniť ho do úvodzoviek („comic sans ms“).

#názov blogu {
font-family: "comic sans ms";
...
Nakoniec budeme pracovať na kóde CSS pre popis vášho blogu (#description). Toto je posledná časť pôvodných šiestich. Ako vidíte nižšie, všetok kód CSS, ktorý riadi vlastnosti písma pre popisný text, je uvedený spolu na jednom riadku. Všetko, čo musíme urobiť, je pridať „comic sans ms“ na začiatok zoznamu fontov, vďaka ktorým bude Comic Sans MS predvolené písmo pre popisný text.

#description {
...
písmo: 78% / 1.4em "comic sans ms""Trebuchet MS", Trebuchet, Arial, Verdana, Sans-serif;
...
}

Po dokončení kliknite na tlačidlo Ukážka, aby ste si pozreli ukážky zmien, a potom zatvorte okno prehliadača, aby ste sa vrátili na predchádzajúcu webovú stránku. Kliknite na tlačidlo Uložiť zmeny šablóny. Keď sa zobrazí potvrdzujúca správa naznačujúca, že zmeny boli uložené, kliknite na tlačidlo Znovu publikovať. Ak chcete skontrolovať, či bol váš blog aktualizovaný, kliknite na kartu Zobraziť blog v ponuke v hornej časti stránky. Možno budete musieť aktualizovať svoju webovú stránku blogu, aby ste si mohli pozrieť zmeny.

Snímky obrazovky dotlačené so súhlasom spoločnosti Google Inc. Google^TM, Blogger^TM a BlogSpot^TM sú registrované ochranné známky alebo ochranné známky spoločnosti Google Inc. v USA a / alebo iných krajinách.

Video Návody: But how does bitcoin actually work? (Smieť 2024).

Prispôsobte sekciu hlavičky svojho blogu Blogger.com Blog, HTML, zmeňte názov a popis svojho blogu Blogger, zmeňte písmo pre šablónu Blogger, pridajte farebné pozadie do šablóny Blogger, zmeňte kód CSS pre šablónu Blogger, pridajte kód CSS do šablóny Blogger , Písmo šablóny Blogger, rodina fontov šablóny Blogger, značky štýlu CSS

Predchádzajúci Článok

Nasledujúci Článok

Súvisiace Články

počítače

Ako spustiť webovú stránku, pridajte tabuľku na svoju webovú stránku, nástroj na výber farieb

Smieť 2024

Ako spustiť webovú stránkuNižšie uvedený kód vytvorí webovú stránku. Vymeňte Webstránka s názvom vašej webovej stránky. Tento názov sa objaví v záhlaví webového prehľadávača. Potom vložte všetok váš...

počítače

Správny spôsob, ako začať projekt platených webových stránok

Smieť 2024

Mnoho profesionálnych tvorcov a vývojárov webových stránok považuje „ťažkých klientov“ za problém číslo jedna. Určite existuje niekoľko klientov, ktorí vám úmyselne sťažia život. našťastie sú tieto...