|
Oldalsó modulcím szerkesztése
2018.12.07. 12:24
Ha szívesen merülsz el a kódolás világában, és szeretsz megismerni új dolgokat, nagyon könnyedén teheted még látványosabbá oldalad.
Ehhez mindössze néhány alaplépést illetve néhány kiegészítést kell ismerned.
A szélső modulban a modulfejléceket ezzel a kóddal tudod szerkeszteni:
/*SZÉLSŐ MODUL*/
.column_side {
margin: 20px !important; (SZÖVEG TÁVOLSÁGA A KERETTŐL)
}
.column_side td.modtitle {
background-color: #000000; (HÁTTÉRSZÍN)
color: #ffffff; (BETŰ SZÍNE)
padding: 15px; (KERET TÁVOLSÁGA)
font-family: 'Cookie', cursive; (BETŰTíPUS)
font-size: 25px; (BETŰMÉRET)
font-style: normal; (FÉLKÖVÉR, DŐLT)
text-decoration: none; (ÁTHÚZÁS, SZÖVEG FÖLÉ VONAL, ALÁHÚZÁS)
text-transform: none; (NAGYBETŰS, KISBETŰS)
text-align: center; (SZÖVEG ELHELYEZÉSE)
}
Természetesen magának a modulcímnek adhatunk keretet:
border-top: 0px solid #333333; (FELÜLÖ
border-bottom: 0px solid #7ea4b3; (ALUL)
border-left: 0px solid #333333; (BALRA)
border-right: 0px solid #333333; (JOBBRA)
}
Lehetőségünk van egy képet is beállítani a modulcím hátterének:
background-image: url(KÉP LINKJE);
}
Kóddal eltolhatjuk az egész modulcím blokkot, ezzel a következő hatást tudjuk elérni: ( FORRÁS)
position:ABSOLUTE!IMPORTANT; /*AZÉRT, HOGY MOZGATHATÓ LEGYEN*/
margin:-170PX!IMPORTANT; /*AZÉRT, HOGY OLDALRA MOZDULJON, minél nagyobb érték annál jobban megy oldalra,*/
width: 150PX!IMPORTANT; /*MEGHATÁROZOM A SZÉLSSÉGÉT*/
margin-top: -10PX!IMPORTANT; /*AZÉRT, HOGY LEJJEBB MOZDULJON, minél nagyobb az értél, annál lejjebb megy*/
}
Mindezek mellett, lehetőségünk van elforgatni a címet:
ms-transform: rotate(270deg); /* IE 9 */
bkit-transform: rotate(270deg); /* Chrome, Safari, Opera */
transform: rotate(270deg); /*Az elforgatás mértéke, 270 foknál balra fordul, 90 foknál pedig jobbra. Ezt a felette lévő 2 sorban is át kell állítani!*/
margin-top: 100px; /* Mennyivel legyen a felső keret felett a szöveg*/
margin-left: -130px!important; /*A forgatás miatt szükséges elcsúsztatni a modulcímet, itt ennek mértékét tudod megadni.*/
|
AJÁNLOM AZ OLDALT
