Testreszabhatja a Blogger.com blog fejléc szakaszát

Lehet 6, 2024

Az utolsó oktatóanyagban testreszabtuk a Linkek részt a Blogger számára^TM weblog. Most testreszabjuk a fejléc részt a blog tetején. A fejléc tartalmazza a blog címét és leírását. Megváltoztatjuk a szöveg betűtípust vagy betűkészletét, és hozzáadunk egy színes hátteret.

Mint az előző oktatóanyagban is, ezeket a fejlesztéseket a sablon HTML-kódjának néhány sor megváltoztatásával hajtjuk végre. Kattintson a Sablon fülre az oldal tetején található menüben, amely eljuttatja az Aktuális sablon szerkesztése szakaszhoz. Az alábbi mezőben található a sablon HTML kódja. Néhány változtatást hajtunk végre a CSS stíluskódban. (Ha többet szeretne megtudni a lépcsőzetes stíluslapokról, kövesse az alábbi linket.) Görgessen lefelé a kódot, amíg el nem éri a CSS stíluscímke fejléc szakaszát. Mint láthatja, a stíluscímke nagyon hosszú, és a stíluscímke fejléc része hat részből áll.

@media all
@media kézi
#Blog cím
# blogcím a
# blogcím a: lebeg
#leírás

A kód első része (@media all) a fejléc jellemzőit, beleértve a szélességet, a margót és a szegély méretét, vezérli. A második rész (@media kéziszámítógép) örökli ezeket a jellemzőket az első részből, és a fejléc szélességét a kézi monitorok 90% -ára változtatja. Mivel azt szeretnénk, hogy az új háttérszínt mindkét esetben használjuk, az első részhez hozzáadunk egy kódot a háttér színéhez (@media all). Ez az új kódsor vastag betűvel alább található. Az alábbi példában világosszürke színt használtunk, de bármilyen színt szívesen használ.

@media all {
#fejléc {
háttér szín: # EFE3EF;
...
Ezután megváltoztatjuk a cím betűtípust a népszerű, alkalmi stílusú betűkészletre, Comic Sans MS néven. Természetesen bármilyen betűtípust szabadon használhat. A sablon CSS-kódjának következő három része (# blogcím, # blogcím, # blogcím a: lebegő) vezérli a blog címét. Az első rész az általános jellemzőket, a másik két rész pedig a szöveg megjelenését szabályozza, amikor hiperhivatkozásként működik. A cím betűkészletének vagy betűkészletének minden példányhoz történő beállításához az első részhez hozzáadjuk a betűkészlet-család CSS-kódját (# blog-title). Mivel a betűkészletnév szóközöket tartalmaz, ezért idézőjelek közé kell helyezni („képregény sans ms”).

#Blog cím {
betűtípus-család: "comic sans ms";
...
Végül a CSS kóddal dolgozunk fel a blogod leírására (#description). Ez az eredeti hat utolsó része. Mint alább látható, az összes CSS-kód, amely a leírás szövegének betűtípus-jellemzőit vezérli, egy sorban kerül felsorolásra. Csak annyit kell tennie, hogy a „Comic Sans ms” betűtípust felveszi a betűtípusok listájának elejére, így a Comic Sans MS az alapértelmezett betűtípus lesz a leírás szövegéhez.

#description {
...
font: 78% / 1.4em "képregény sans ms", "Trebuchet MS", Trebuchet, Arial, Verdana, Sans-serif;
...
}

Ha végzett, kattintson a Előnézet gombra a módosítások előnézéséhez, majd zárja be a böngészőablakot az előző weboldalra való visszatéréshez. Kattintson a Sablon változások mentése gombra. Amikor megjelenik a megerősítő üzenet, amely jelzi, hogy a módosítások mentésre kerültek, kattintson az Újra kiadás gombra. A blog frissítésének ellenőrzéséhez kattintson az oldal tetején lévő menü Blog megtekintése fülére. Lehetséges, hogy frissítenie kell a blog weboldalát a változások megtekintéséhez.

A Google Inc. engedélyével újranyomtatott képernyőképeket^TM, Blogger^TM és a BlogSpot^TM vagy a Google Inc. bejegyzett védjegyei vagy védjegyei az Egyesült Államokban és / vagy más országokban.

Testreszabhatja a Blogger.com blog fejléc szakaszát, HTML-jét, változtassa meg a Blogger blog címét és leírását, változtassa meg a Blogger sablon betűtípust, adjon hozzá színes hátteret a Blogger sablonnak, változtasson CSS kódot a Blogger sablonhoz, adjon hozzá CSS kódot a Blogger sablonhoz , Blogger sablon betűtípus, Blogger sablon betűtípus-család, CSS stíluscímkék

Előző Cikk

Következő Cikk

Kapcsolódó Cikkek

számítógépek

Kézműves fotózás alapjai Candice Stringham

Lehet 2024

Ön még nem ismeri a termékfotózást? Ez a CreativeLive Craft Photography Fundamentals videó tanfolyam, melyet Candice Stringham készített, sok kérdésre válaszol. Nem vagyok fotós, de amikor SVG...

számítógépek

ScreenFlow kommentárok és beágyazott klipek

Lehet 2024

Az utolsó oktatóprogramban megtanulta, hogyan lehet szöveget hozzáadni egy rövid marketing videóhoz, és hogyan építheti fel a cég logóját a szöveg és az importált logó grafika kombinációjával. A...