Marketing treści

Blogger: styl CSS dla kodu na Twoim blogu

Znajomy zapytał mnie, jak utworzyłem regiony kodu we wpisie Bloggera. Zrobiłem to, używając tagu stylu dla CSS w moim szablonie Bloggera. Oto co dodałem:

p.code {
    font-family: Courier New;
    font-size: 8pt;
    border-style: inset;
    border-width: 3px;
    padding: 5px;
    background-color: #FFFFFF;
    line-height: 100%;
    margin: 10px;
}
  1. p.code: To jest reguła CSS, której celem jest HTML <p> elementy o nazwie klasy „code”. Oznacza to, że dowolny akapit z tą klasą będzie stylizowany zgodnie z poniższymi właściwościami.
  2. font-family: Courier New;: ta właściwość ustawia rodzinę czcionek na „Curier New”. Określa czcionkę, która będzie używana w tekście w docelowych elementach.
  3. font-size: 8pt;: Ta właściwość ustawia rozmiar czcionki na 8 punktów. Tekst w docelowych elementach będzie wyświetlany przy tym rozmiarze czcionki.
  4. border-style: inset;: ta właściwość ustawia styl obramowania na „wstawiony”. Tworzy zapadnięty lub wciśnięty wygląd obramowania wokół docelowych elementów.
  5. border-width: 3px;: Ta właściwość ustawia szerokość obramowania na 3 piksele. Obramowanie wokół elementów będzie miało grubość 3 pikseli.
  6. padding: 5px;: ta właściwość dodaje 5 pikseli wypełnienia wokół zawartości elementów docelowych. Zapewnia odstęp między tekstem a obramowaniem.
  7. background-color: #FFFFFF;: Ta właściwość ustawia kolor tła na biały (#FFFFFF). Treść docelowych elementów będzie miała białe tło.
  8. line-height: 100%;: Ta właściwość ustawia wysokość linii na 100% rozmiaru czcionki. Zapewnia to rozmieszczenie linii tekstu zgodnie z rozmiarem czcionki.
  9. margin: 10px;: Ta właściwość dodaje margines 10 pikseli wokół całego elementu. Zapewnia odstęp pomiędzy tym elementem a innymi elementami na stronie.

Dostarczony kod CSS definiuje styl akapitów HTML za pomocą klasy „code”. Ustawia czcionkę, rozmiar czcionki, styl obramowania, szerokość obramowania, dopełnienie, kolor tła, wysokość linii i margines dla tych akapitów. Ten styl można zastosować do fragmentów kodu lub wstępnie sformatowanego tekstu w poście w Bloggerze, aby nadać im specyficzny wygląd.

Oto jak to będzie wyglądać:

kod p. {
rodzina czcionek: Courier New;
rozmiar czcionki: 8 pkt;
styl obramowania: wstawka;
szerokość obramowania: 3px;
padding: 5px;
kolor tła: #FFFFFF;
wysokość linii: 100%;
margines: 10px;
}

Miłego kodowania!

Douglas Karr

Douglas Karr jest dyrektorem ds. marketingu OtwórzWglądy i założycielem Martech Zone. Douglas pomógł dziesiątkom odnoszących sukcesy start-upów MarTech, pomagał w due diligence ponad 5 miliardów dolarów w przejęciach i inwestycjach Martech i nadal pomaga firmom we wdrażaniu i automatyzacji ich strategii sprzedaży i marketingu. Douglas to uznany na całym świecie ekspert ds. transformacji cyfrowej oraz MarTech i mówca. Douglas jest także autorem przewodnika dla manekinów i książki o przywództwie biznesowym.

Powiązane artykuły

Powrót do góry przycisk
Zamknij

Wykryto Adblock

Martech Zone jest w stanie udostępnić Ci te treści bez żadnych kosztów, ponieważ zarabiamy na naszej witrynie poprzez przychody z reklam, linki partnerskie i sponsoring. Będziemy wdzięczni za usunięcie blokady reklam podczas przeglądania naszej witryny.