Dostosuj sekcję nagłówka swojego bloga Blogger.com

Kwiecień 29, 2024

W ostatnim samouczku dostosowaliśmy sekcję Linki do Twojego Bloggera^TM blog internetowy. Teraz dostosujemy sekcję Nagłówek u góry bloga. Nagłówek zawiera tytuł i opis Twojego bloga. Zamierzamy zmienić czcionkę lub czcionkę tekstu i dodać kolorowe tło.

Podobnie jak w ostatnim samouczku, wprowadzimy te ulepszenia, zmieniając kilka wierszy kodu HTML szablonu. Kliknij kartę Szablon w menu u góry strony, która przeniesie Cię do sekcji Edytuj bieżący szablon. Kod HTML szablonu znajdziesz w polu poniżej. Wprowadzimy kilka zmian w kodzie stylu CSS. (Aby dowiedzieć się więcej o kaskadowych arkuszach stylów, kliknij poniższy link.) Przewiń kod w dół, aż dojdziesz do sekcji Nagłówek w tagu stylu CSS. Jak widać, znacznik stylu jest bardzo długi, a sekcja Nagłówek znacznika stylu ma sześć części.

@media all
@media handheld
#Tytuł bloga
# blog-tytuł a
# blog-title a: hover
#opis

Pierwsza część kodu (@media all) kontroluje cechy nagłówka, w tym szerokość, margines i rozmiar ramki. Druga część (@media handheld) dziedziczy te cechy z pierwszej części, a także zmienia szerokość nagłówka do 90 procent dla monitorów przenośnych. Ponieważ chcemy, aby nowy kolor tła był używany w obu przypadkach, dodamy wiersz kodu dla koloru tła w pierwszej części (@media all). Ten nowy wiersz kodu jest pogrubiony poniżej. W poniższym przykładzie użyliśmy jasnoszarego koloru, ale możesz użyć dowolnego koloru, który chcesz.

@media all {
#nagłówek {
kolor tła: # EFE3EF;
...
Następnie zmienimy krój pisma w tytule na popularną, swobodną czcionkę o nazwie Comic Sans MS. Oczywiście możesz dowolnie używać dowolnej czcionki. Kolejne trzy części kodu CSS szablonu (# tytuł bloga, # tytuł bloga a, # tytuł bloga a: najechanie kursorem) kontrolują właściwości tytułu bloga. Pierwsza część kontroluje ogólną charakterystykę, a pozostałe dwie kontrolują wygląd tekstu, gdy działa on jako hiperłącze. Aby ustawić krój czcionki lub czcionkę tytułu, dla wszystkich instancji dodamy kod CSS dla rodziny czcionek do pierwszej części (# tytuł-blogu). Ponieważ nasza nazwa czcionki zawiera spacje, należy ją również umieścić w cudzysłowie („comic sans ms”).

#Tytuł bloga {
font-family: "comic sans ms";
...
Na koniec będziemy pracować nad kodem CSS do opisu twojego bloga (#description). To ostatnia część oryginalnej szóstki. Jak widać poniżej, cały kod CSS, który kontroluje cechy czcionki tekstu opisu, jest wymieniony razem w jednym wierszu. Wszystko, co musimy zrobić, to dodać „comic sans ms” na początku listy czcionek, co sprawi, że Comic Sans MS będzie domyślną czcionką tekstu opisu.

#description {
...
czcionka: 78% / 1,4em „komiks bez ms”, „Trebuchet MS”, Trebuchet, Arial, Verdana, Sans-serif;
...
}

Po zakończeniu kliknij przycisk Podgląd, aby wyświetlić podgląd zmian, a następnie zamknij okno przeglądarki, aby powrócić do poprzedniej strony. Kliknij przycisk Zapisz zmiany szablonu. Gdy zobaczysz komunikat potwierdzający, że zmiany zostały zapisane, kliknij przycisk Opublikuj ponownie. Aby sprawdzić, czy Twój blog został zaktualizowany, kliknij kartę Wyświetl blog w menu u góry strony. Aby zobaczyć zmiany, może być konieczne odświeżenie strony bloga.

Zrzuty ekranu przedrukowane za zgodą Google Inc. Google^TM, Blogger^TM i BlogSpot^TM są zastrzeżonymi znakami towarowymi lub znakami towarowymi firmy Google Inc. w Stanach Zjednoczonych i / lub innych krajach.

Instrukcje Wideo: Tworzenie kart - blogspot (Kwiecień 2024).

Dostosuj sekcję Nagłówek swojego bloga Blogger.com, HTML, zmień tytuł i opis swojego bloga Blogger, zmień krój pisma dla szablonu Blogger, dodaj kolorowe tło do szablonu Blogger, zmień kod CSS dla szablonu Blogger, dodaj kod CSS do szablonu Blogger , Czcionka szablonu Blogger, rodzina czcionek szablonu Blogger, tagi stylu CSS

Poprzedni Artykuł

Następny Artykuł

Powiązane Artykuły

komputery

Czy powinienem używać Flasha lub Silverlight

Kwiecień 2024

Większość osób, które zwracają uwagę na powstający świat technologii i gadżetów, może być zaznajomiona ze słynną twardą postawą Apple'a dotyczącą odmowy skonfigurowania produktów iOS do grania we...

komputery

Używanie ASP do kodowania kanału RSS

Kwiecień 2024

Kanały RSS umożliwiają łatwe syndykowanie treści do użytkownika końcowego lub innej witryny. ASP może pomóc w łatwym utworzeniu własnego kanału RSS dla Twojej witryny. Wiem, co zamierzam opisać, na...