Content Marketing

Blogger: CSS-stílus a kódhoz a blogodban

Egy barátom megkérdezte, hogyan készítettem el a kódrégiókat a Blogger bejegyzésben. Ezt a Blogger-sablonban található CSS-stíluscímkével csináltam. Íme, amit hozzátettem:

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: Ez egy CSS-szabály, amely a HTML-t célozza meg <p> „code” osztálynévvel rendelkező elemek. Ez azt jelenti, hogy az ilyen osztályú bekezdések stílusa a következő tulajdonságok szerint történik.
  2. font-family: Courier New;: Ez a tulajdonság a „Courier New” betűtípuscsaládot állítja be. Meghatározza azt a betűtípust, amelyet a megcélzott elemeken belül a szöveghez használunk.
  3. font-size: 8pt;: Ez a tulajdonság 8 pontra állítja a betűméretet. A megcélzott elemeken belüli szöveg ezzel a betűmérettel jelenik meg.
  4. border-style: inset;: Ez a tulajdonság a szegélystílust „inset”-re állítja. Süllyesztett vagy préselt megjelenést hoz létre a szegélynek a megcélzott elemek körül.
  5. border-width: 3px;: Ez a tulajdonság a szegély szélességét 3 képpontra állítja be. Az elemek körüli szegély 3 képpont vastag lesz.
  6. padding: 5px;: Ez a tulajdonság 5 képpontnyi kitöltést ad a tartalom köré a célzott elemeken belül. Térközt biztosít a szöveg és a szegély között.
  7. background-color: #FFFFFF;: Ez a tulajdonság a háttérszínt fehérre állítja (#FFFFFF). A megcélzott elemeken belüli tartalom fehér hátterű lesz.
  8. line-height: 100%;: Ez a tulajdonság a sormagasságot a betűméret 100%-ára állítja be. Biztosítja, hogy a szövegsorok a betűméretnek megfelelően legyenek elosztva.
  9. margin: 10px;: Ez a tulajdonság 10 képpontos margót ad a teljes elem körül. Térközt biztosít ezen elem és az oldalon lévő többi elem között.

A mellékelt CSS-kód stílust határoz meg a „code” osztályú HTML-bekezdések számára. Beállítja a betűtípust, a betűméretet, a keret stílusát, a szegély szélességét, a kitöltést, a háttérszínt, a sor magasságát és a margót ezekhez a bekezdésekhez. Ez a stílus alkalmazható kódrészletekre vagy előre formázott szövegekre a Blogger-bejegyzésekben, hogy sajátos megjelenést kapjanak.

Így fog kinézni:

p.code {
font-family: Courier New;
betűméret: 8pt;
szegély-stílus: betét;
keret szélessége: 3 képpont;
padding: 5px;
háttérszín: #FFFFFF;
vonalmagasság: 100%;
margó: 10px;
}

Boldog kódolás!

Douglas Karr

Douglas Karr CMO of OpenINSIGHTS és az alapítója a Martech Zone. Douglas több tucat sikeres MarTech startupnak segített, több mint 5 milliárd dolláros átvilágításban segédkezett a Martech akvizíciókban és befektetésekben, és továbbra is segíti a vállalatokat értékesítési és marketingstratégiáik megvalósításában és automatizálásában. Douglas nemzetközileg elismert digitális átalakulás és MarTech szakértő és előadó. Douglas egy Dummie's Guide és egy üzleti vezetői könyv szerzője is.

Kapcsolódó cikkek

Vissza a lap tetejére gombra
közel

Adblock észlelve

Martech Zone ingyenesen tudja biztosítani Önnek ezt a tartalmat, mivel webhelyünkkel bevételt szerezünk hirdetési bevételek, társult linkek és szponzorálás révén. Nagyra értékelnénk, ha eltávolítaná hirdetésblokkolóját, miközben megtekinti webhelyünket.