WYŚRODKOWANIA
Wyśrodkowanie gadżetów w
lewej kolumnie:
.column-left-inner {text-align: center; }
Wyśrodkowanie gadżetów w
prawej kolumnie:
.column-right-inner {text-align: center;
}
Wyśrodkowanie gadżetów w
środkowej kolumnie:
.column-center-inner {text-align: center;}
Wyśrodkowanie daty:
h2.date-header {text-align: center;}
Wyśrodkowanie tytułu postu:
h3.post-title {text-align: center;}
Wyśrodkowanie napisu „Komentarz”
.comments h4 {text-align: center;}
Wyśrodkowanie tytułu
gadżetu:
.widget h2 {text-align: center;}
Wyśrodkowanie tytułu
gadżetu w lewej kolumnie:
.column-left-inner .widgeth2 {text-align:
center;}
Wyśrodkowanie tytułu
gadżetu w prawej kolumnie:
.column-right-inner .widgeth2
{text-align: center;}
Wyśrodkowanie górnego menu:
#PageList1 ul {text-align: center;}
#PageList1 ul li {float: none; display:
inline;}
Wyśrodkowanie nagłówka:
.header-inner .widget div, .header-inner
img {
margin-left:auto;
margin-right:auto;
}
LINKI
Podkreślenia nad i pod
linkiem:
a:hover {text-decoration: overline
underline;}
Podkreślenia pod linkiem:
a:hover {text-decoration: underline;}
Przekreślenie linku:
a:hover {text-decoration: line-through;}
Brak podkreśleń linków:
a:hover {text-decoration: none;}
Brak podkreśleń postu:
h3.post-title a:hover {text-decoration:
none;}
Rozszerzenie liter po
najeździe na link:
a:hover { letter-spacing: 4px }
Rozszerzenie wyrazów po
najedzie na link:
a:hover { word-spacing: 10px }
Cienie po najeździe na
link:
a:hover
{text-shadow: 1px 2px 5px #000000 }
Zmiana czcionki po
najeździe na link:
a:hover {font-family: Arial;}
Ramka po najeździe na link:
a) Linia ciągła:
a:hover {border-style: solid;}
b) Linia podwójna:
a:hover {border-style: double;}
c) Linia kreskowana:
a:hover {border-style: dashed;}
d) Linia kropkowana:
a:hover {border-style: dotted;}
Grubość ramki linku
(rozmiary do dopasowania):
a:hover {border-width: 2px;}
Cień ramki linku (do
dopasowania):
a:hover {box-shadow: 2px 2px 5px;}
Kolor ramki i tekstu linku:
a:hover {color: #000000;}
| JUSTOWANIE
Wyjustowanie tekstu w lewej kolumnie:
.column-left-inner {text-align:justify; }
Wyjustowanie tekstu w prawej kolumnie:
.column-right-inner {text-align: justify;}
Wyśrodkowanie tekstu w środkowej kolumnie:
.column-center-inner {text-align: justify;}
Wyśrodkowanie tekstu poście:
.post{text-align: justify;}
lub
.post-body {text-align: justify;}
CIENIE
Cienie w kolumnie lewej:
.column-left-inner {text-shadow: 1px 1px
5px;}
Cienie w kolumnie prawej:
.column-right-inner {text-shadow: 1px 1px
5px;}
Cienie w kolumnie
środkowej:
.column-center-inner {text-shadow: 1px
1px 5px;}
Cienie tytułu gadżetu:
.widget h2 {text-shadow: 1px 1px 5px;}
Cienie w tytule postu:
h3.post-title {text-shadow: 1px 1px 5px;}
Napis „Komentarz”:
.comments h4 {text-shadow: 1px 1px 1px;}
Górne menu:
#PageList1 {text-shadow: 1px 1px 5px;}
Data:
h2.date-header {text-shadow: 1px 1px 5px;}
Komentarze:
.comments {text-shadow: 1px 1px 5px;}
RESZTA
Podniesienie nagłówka
.header { height: 550px;}
Usunięcie tekstu
„Starszy/Nowszy post”
.blog-pager { display: none !important;}
Usunięcie tekstu
„Technologia Blogger”
.Attribution { display:none; }
|
11/01/2012
Arkusze CSS dla czytelników
Subskrybuj:
Komentarze do posta (Atom)
Gdzie wpisać te kody?
OdpowiedzUsuńblogger-układ-projektant szablonów-zaawansowane- i na końcu akrusze CSS
UsuńBardzo przydatne te kody :D Dziękuję i pozdrawiam : *
Usuńzgadzam się
UsuńDziękuję, za te kody. Bardzo pomagają przy tworzeniu bloga. Jeszcze raz dziękuję i pozdrawiam :**
OdpowiedzUsuńA jak podnieść pasek boczny? Tak ,żeby był przy nagłówku. Jeśli wiesz to pomóż!
OdpowiedzUsuńDodaj jako osobny gadżet, a nie nagłówek :D.
UsuńChyba się nie rozumiemy ;//
UsuńPasek boczny? Chodzi ci o kolumnę prawą/lewą tak?
Usuń.column-right-inner {margin: -90px 0px 0px 0px;}
.column-left-inner {margin: -90px 0px 0px 0px;}
Zależnie od tego jaka to jest kolumna. Możesz użyć też kodu:
.header { height: 550px;}
Tekst i kolumny będą nachodzić na nagłówek. Musisz sobie ustawić tak, b ci pasowało.
Jeśli nie o to ci chodzi, skontaktuj się ze mną na GG lub pocztą e-mail. Musiałabym zobaczyć twój szablon, by pomóc. Wróżkami nie jesteśmy, dlatego czekam na adres bloga/szablonu ;]
Dziękuję. Wszystko działa jak najlepiej :)
UsuńBardzo się cieszę, że pomogłam :]
UsuńTeraz "bawię się" z tymi arkuszami CSS i bardzo mi się przydadzą. Dziękuję :)
OdpowiedzUsuńHej, a jak mogę zmienić czcionki w 'stronach' nie mogę zmienić czcionki strony głównej i bohaterów i bardzo mi to przeszkadza.
OdpowiedzUsuńZmienić czcionkę możesz w Dostosuj > Zaawansowane > Szukasz w spinie Tekst kart (powinno ci się to pojawić, jeśli szablon domyślny to taki czarny, nie pamiętam jak się nazywa) > Masz możliwość zmiany czcionki. U mnie w każdym razie jest taka możliwość, więc nie powinnaś mieć problemu :P Jakby co, to pisz :>
OdpowiedzUsuńCo zrobić żeby pojawiła się taka zakładka: Rozdziały a kiedy w nią klikniemy to wyświetlą się wszystkie rozdziały napisane tak jak np tutaj :http://love-is-not-easy-baby.blogspot.com/p/rozdziay.html
OdpowiedzUsuńTutaj trzeba przejść w Ustawienia > Strony > Tworzysz podstronę pod nawą Spis treści, Rozdziały, czy cokolwiek innego. Wszystko musisz linkować ręcznie, nie ma na to kodu CSS. Wpisujesz tytuł rozdziału, kopiujesz odnośnik do niego i wklejasz jako link. Później tylko publikujesz i gotowe. Jeśli czegoś nie wiesz - daj znać.
UsuńWielkie dzięki ;)!
UsuńMam mały problemik ze swoim blogiem... Chciałabym, aby pasek z gadżetami znajdował się bliżej postów. Czy może mi ktoś podać kod lub instrukcję jak to zrobić? Bardzo dziękuję za pomoc; *
OdpowiedzUsuń.tabs-outer {margin: 0px -140px 0px 486px;} - pasek stron na górze
Usuń.column-right-inner {border-radius: 90px 90px 40px 40px;} - kolumna boczna prawa
.column-left-inner {border-radius: 90px 90px 40px 40px;} - lewa
a to do postu: .column-center-inner {margin: 90px 300px 0px -400px;}
To są kody na przesunięcie odpowiednich gadżetów. Wszystkie cyfry możesz zmieniać, liczą się tutaj też ujemne wartości. Któryś z tych powinien załatwić sprawę.
ale żaden z tych kodów nie przysuwa paska bocznego do posta..
UsuńJuż ci mówię. Jeśli jest to kolumna lewa to wykorzystaj te kody:
Usuń.column-left-inner{
margin-left: 125px; */Margines lewy/*
margin-right: -150px; */Margines prawy*
}
na kolumnę prawą kod:
.column-right-inner{
margin-left: 125px; */Margines lewy/*
margin-right: -150px; */Margines prawy*
}
Marginesy trzeba sobie dostosować, powinny działać. W każdym razie u mnie chodzi wszystko ładnie, jeśli będziesz mieć problemy to proszę o kontakt - 503987 :)
Mam pewien problem. Gdy wpisuję kod na cień i wyśrodkowanie w tytule gadżetu pojawia mi się to również w dacie. Czy jest taka możliwość żeby te kody odnosiły się tylko do gadżetów, a nie do gadżetów i do daty?
OdpowiedzUsuńUżyj tego kodu, sprawdzone :)
Usuńh2.date-header {text-shadow: none}
Proszę bardzo :D
Mam problem z kartami :c http://my-world-of-fashionn.blogspot.com/ na tym blogu (na potrzeby szkolne) karty nie wyświetlają się tak jak powinny. Jest ich 5, ale kiedy najadę na jedną - ostatnia znika i nie ma jej w kolejnej linijce. Jak zlikwidować ten problem?
OdpowiedzUsuńJuż nie trzeba :) Błąd w html'u :)
UsuńPrzydatne :D
OdpowiedzUsuńpobrałam parę,przydatne bardzo :)
OdpowiedzUsuńMam pytanie :) Co zrobić, jeśli chcę, aby tekst i lewa kolumna nachodziły na nagłówek, ale na różnych wysokościach?
OdpowiedzUsuń.column-left-inner{
Usuńposition: absolute;
top: 20px;
left: 50px;
}
To jest kod zmieniaj parametry obok top i left, to wyjdzie ci efekt taki jaki chcesz. Nie wytłumaczę Ci teraz, bo trochę mi się śpieszy, ale myślę, że nie jest to trudne.
Mam pytanko :)
OdpowiedzUsuńW jaki sposób zrobiłyście te śliczne cienie po najechaniu na link?
Chodzi mi o to, że tekst staje się coraz jaśniejszy ...
Jak uzyskać taki efekt?
* coraz CIEMNIEJSZY
Usuńa:hover {
Usuńcolor: #7b7b7b;
transition: all 0.7s;
-moz-transition: all 0.7s;
-webkit-transition: all 0.7s;
-o-transition: all 0.7s;
}
To jest przykładowy kod na to, by linki zmieniały kolor czcionki na ciemniejszy. Kluczem w tym chodzie jest 'transition: all 0.7s;
-moz-transition: all 0.7s;
-webkit-transition: all 0.7s;
-o-transition: all 0.7s;", bo dzięki temu staje się to tak powoli, a nie w jeden moment. :)
A jeśli chcesz zamiast koloru czcionki, zastosuj "text-shadow: 0px 0px 3px black" Wartości możesz zmieniać. :)
Heej nie mogę zrobić kolumn jeżeli bire na szablon biały rewelacja to paski boczne są nie złączone tylko przerywane !! i nie wiem może jets jakiś kod ? prosze o pilna pomoc ;c
OdpowiedzUsuńzawsze ustawiaj szablon czarny rewelacja
UsuńJaki jest kod na przesunięcie nagłówka? Chodzi mi o przesunięcie w prawą stronę :)
OdpowiedzUsuń.header-inner .widget div, .header-inner img {
Usuńmargin-left: -70px;
margin-right: 340px;
}
Musisz tylko pokombinować z wartościami w margin-right i margin-left :)
Jak to się wpisuje, czy przed tymi kodami coś trzeba dodać, jestem kompletnie zielona :(
OdpowiedzUsuńNa każdy kod musi być nowa linijka, czyli np. wklejasz kod, wciskasz enter i w następnej linijce następny kod :)
Usuńjak połączyć nagłówek z postami tak jak tutaj http://marysia-k.blogspot.com/ ?? :)
OdpowiedzUsuńDołączam się do pytania.
Usuńna tamtej stronie to nie nagłówek a zwykłe zdjęcie wklejone do nagłówka w układzie "biel".
UsuńBardzo przydatne kody :)
OdpowiedzUsuńDziękujemy :)
Usuńte kody na prawdę są świetne! Dzięki Wam każdy może się w tym pobawić i utworzyć szablony ... dziękuję, że je dodaliście ^^
OdpowiedzUsuńnie ma sprawy ;)
Usuńhmm. A nie masz może jakiegoś kodu na usunięcie punktorów w kartach bocznych, [eliza-zdybel.blogspot.com] bo nie umiem się ich pozbyć ;<
OdpowiedzUsuńJaki jest kod, na zmniejszenie marginesów w kolumnie bocznej (szablon rewelacje czarny) :)?
OdpowiedzUsuńWitajcie :) Ostatnio trafiłam na wasz blog, który okazał się być bardzo pomocny. Tworzycie naprawdę ładne prace oraz przydatne kody CSS, które niejednokrotnie uratowały mi skórę ^^ Ale od dłuższego czasu mam pewien problem. Nie wiem co się dzieje z moim pseudo próbnym blogiem na grafikę. Otóż próbuję wstawić kod CSS na prawą oraz lewą kolumnę, ale selektory na kształt ramek i tło w ogóle nie chcą mi działać! Może któraś z was wie o co w tym chodzi i mogłaby mi pomóc? Myślę, że to ma związek z HTML'em ale najpierw wolę się upewnić, zanim zacznę w nim grzebać:) I daję jeszcze linka na bloga, jakby co: http://szalalala.blogspot.com/. Z góry dziękuję za odpowiedź ^^
OdpowiedzUsuńostatnio blogger nie tylko tobie szaleje, ale wszystkim, zmieniają kody przez co trzeba będzie się nauczyć nowych. Na obecną chwilę polecam typowy zamiennik selektora zaczynający się na .main-inner. przykład:
Usuń.main-inner .column-left-inner
Faktycznie trochę szwankuje, ale miejmy nadzieję, że to tylko chwilowa awaria, bo za nic nie chciałabym wrócić teraz na onet albo co gorsza przenieść się na inny portal -,- Ok ^^ Spróbuję z tym selektorem :) Dzięki;*
UsuńNie wiem gdzie mam zadać to pytanie, wiec pisze tutaj. Kilka miesięcy temu zamówiłam u was szablon. Wszystko działało do tej pory jak należy, ale od jakichś 2 dni gdy wchodzę na swojego bloga nie widzę zdjęć na szablonie które jeszcze dwa dni temu miałam ! nie wiem co się stało, nic nie robiłam przy tym, a to po prostu sobie zniknęło. Wszystko tak jak było jest oprócz tych zdjęć na szablonie. Proszę o pomoc.
OdpowiedzUsuńkontakt: livewithpassion@wp.pl
bardzo pomocne, dziękuję ^^
OdpowiedzUsuńMogłybyście powiedzieć mi jak moge zrobić , zeby nagłowek był troche niżej przy pasku bocznym i łączył się z postami ? Proszę
OdpowiedzUsuńTeż szukam odpowiedzi na to pytanie ://
Usuń1. Jak zrobić ten czarny pasek jaki Wy macie?
OdpowiedzUsuń2. Ja w pasku bocznym połączyć wszystkie gadżety (mam przerwy)?
Świetne ! najbardziej spodobało mi się rozszerzanie literek po najeździe na link :))
OdpowiedzUsuńMam problem :( Jak zrobić , aby kolumna lewa była równa z nagłówkiem , żeby kolumna była oddzielona od od reszty ( czyli posta i nagłówka ) tak jak na tych blogach ??? :
OdpowiedzUsuńhttp://oliwiaa-blog.blogspot.com/
http://wiska-wiskaa.blogspot.com/
http://lucy-luucy.blogspot.com/
Błagam was , pomużcie !!!!! :( Nie wiem jak to zrobić ....
Dołączam się do pytania :)
Usuńza nagłówek musi posłużyć jakiś mały obrazek, by kolumna się dopasowała. Do kolumny (lewej) wklejasz ten kod: .column-left-inner {background-color: #4c3e6c;} (kod na kolor kolumny, cyfry i litery po znaku # oznaczają dany kolor, można zmieniać) a następnie przesuwasz kodem: .column-left-inner {margin: 90px 300px 0px -400px;} cyfry można zmieniać.
UsuńMoże się przyda
Nic nie działa ... Albo po prostu źle to robię .
UsuńPS.Gdzie i jak wpisać te kody aby działały ????
blogger-szablon-dostosuj-projektant szablonów - arkusze Css
Usuńi każdy w osobnej linijce
Dziękuję ♥
OdpowiedzUsuńMam prośbę - nie wiem czemu mój nagłówek jest wyśrodkowany, i nie chciałabym żeby był wyśrodkowany, tylko tak jakby "Zaczynał sie" od lewej strony. Szukam i szukam w internecie i odpowiedzi znaleźć nie mogę na jakiś kod css. Może pomożesz ? :)
OdpowiedzUsuńMam pytanie ;) Chiałabym podnieść post ;D żeby nachodził troszeczkę na obraz ponieważ jest bardzo nisko i kompletnie go nie widac jak wchodzi się na bloga tak samo z kolumną ;D
OdpowiedzUsuńczy jest na to jakis kod ? ;D
.column-center-inner {margin: -120px 0px 0px 0px;}
Usuńmożesz pobawić się cyframi, działają też na ujemnych
Jej, dzięki za kody *.* Przydały się, i to bardzo!
OdpowiedzUsuńWitam :)
OdpowiedzUsuńA jak mogę usunąć tytuły gadżetów w pasku bocznym ? :)
Pozdrawiam
No właśnie, jak?
UsuńUkład blogerra, wejdź na dany gadżet i usuń po prostu to, co jest tam napisane. Zostaw puste pole i zapisz. Po kłopocie. W niektórych gadżetach jest też opcja zaznaczona haczykiem, by usunąć tytuł.
UsuńA czy wiecie jak połączyć nagłówek z postami? Tak jak tutaj :
OdpowiedzUsuńlucy-luucy.blogspot.com
.column-center-inner {margin: 90px 0px 0px 0px;} - pobaw się to pierwszą liczbą. Działają także na ujemnych
UsuńHej! Co mam zrobić, jeżeli kod na marginesy kolumn nie działa? Próbowałam wszystkiego... Nic nie działa :c
OdpowiedzUsuńhej :) już zrobiłam to żeby post i nagłówek nachodzi. Ale jak mam usunąć te cienie??
OdpowiedzUsuńWiecie może, jak dodać cień do tytułu posta? :) Jeśli to gdzieś jest na tym blogu, to widocznie przeoczyłam i przepraszam za to. Dziękuję z góry za pomoc. :)
OdpowiedzUsuńh3.post-title, .comments {text-shadow: 1px 1px 5px}
UsuńJak zrobić taki spis treści jak wy macie? W sensie jak się robi archiwum rozwijane to pokazują się tylko miesiące, a co zrobić by pojawiały się nazwy postów?
OdpowiedzUsuńTutaj znajdziesz wszystko, czego potrzebujesz do stworzenia szerokiej listy. :)
Usuńhttp://zaczarowane-instrukcje.blogspot.com/2012/10/3-przepis-menuszeroka-liste.html
Ten komentarz został usunięty przez autora.
UsuńJak mogę ,,zacieniować" posty? Podajcie mi kod. Proszę.
OdpowiedzUsuńZacieniować posty? Chodzi o cień ramki? Nie ma sprawy, jest do tego kilka selektorów, więc podam wszystkie:
Usuń.post-body {box-shadow: 0px 0px 10px #000;}
.post {box-shadow: 0px 0px 10px #000;}
.column-center-inner {box-shadow: 0px 0px 10px #000;}
Wartości można zmieniać dowolnie. To ostatnie to kolor cienia. :)
Czy wiecie może jaki jest kod na przesunięcie kart?
OdpowiedzUsuńChodzi mi o taki jak ten: .header-inner .widget div, .header-inner img {
margin-left: -70px;
margin-right: 340px;
}
tylko do kart. Z góry dziękuję ;)
Zmieniasz selektor na #PageList1, to w nawiasie zostawiasz. I gotowe. ;3
UsuńWitam mam problem tego typu wstawiłem button like it,ale chce by mi sie wyśrodkował w ramce...jak to zrobić??
OdpowiedzUsuńwklej kod .column-left-inner {text-align: center} Powinno załapać. ;3
Usuńjasne wszysko gra przy gadzetach bloggera,ale jak chce wysrodkować gadzet html/javascript to niestety nie idzie.W szczególności tabelka z lubie,ale jak nie można tego zmienić to trudno.kod pobrałem z facebooka.
OdpowiedzUsuńA jak zrobić, żeby nagłówek nie był na środku, tylko ymm... Po boku. Tak jak np. lewa kolumna?
OdpowiedzUsuńMam problem z połączeniem lewego paska bocznego z wyśrodkowanymi postami: http://innowacyjniepl.blogspot.com/; próbowałem wszystkich kodów, w CSS nie działa żaden, nie wiem jak to zrobić;(
OdpowiedzUsuńJak zmniejszyc odstep miedzy gadzetami ? :D
OdpowiedzUsuńJak pozbyć się punktorów przy liście stron?
OdpowiedzUsuńWpisuje kody, np. żeby wyśrodkować tytuły, to w ogóle mi to nie dziala :/ Co zrobić ?
OdpowiedzUsuńJak połączyć gadżety ze sobą w jedną kolumnę? Mam przerwy :( (szablon czarny rewelacja)
OdpowiedzUsuńkodu nie ma, jest za to opcja:
UsuńBlogger - szablon - dostosuj - zaawansowane - Tło postów - tło gadżetów - ustaw na przeźroczyste i gotowe
jak mogę zrobić takie ustawienie nagłówka, głównej kolumny i paska bocznego jak jest na http://binka-blog.blogspot.com/ i od jakiego szablonu najlepiej zacząć?
OdpowiedzUsuńHej. Interesują mnie dwa kody
OdpowiedzUsuńRozszerzenie liter po najeździe na link:
a:hover { letter-spacing: 4px }
lub
Rozszerzenie wyrazów po najedzie na link:
a:hover { word-spacing: 10px }
Ale chciałabym żeby to było tylko na pasku stron a nie przy wszystkich linkach. Pomożecie mi to zrobić ? :)
Bardzo dziękuję, kody były mi strasznie potrzebne :*
OdpowiedzUsuńpomogłyście z wyśrodkowaniem bocznej kolumny, dziękuję! :*
OdpowiedzUsuńjak połączyć gadżety tak jak na blogu poniżej i pasek stron umieścić nad nagłówkiem ?
OdpowiedzUsuńhttp://oliwiaa-blog.blogspot.com/p/o-mnie.html
Dziękuje wam za waszą cięszką pracę :* Dzięki wam moge założyć bloga i nie wstydzić się podstawowego wyglądu, KOCHAM WAS MORMALNIE <3
OdpowiedzUsuńWitam serdecznie mam problem z wyśrodkowaniem lewego paska bocznego. Wpisuje i wyśrodkowane zostaje tylko opis O MNIE, zdjęcie i napis ARCHIWUM i za nic w świecie nie mogę wyśrodkować tego co jest pod napisem ARCHIWUM czyli spisu starszych postów problem jak na dłoni widoczny tu
OdpowiedzUsuńhttp://madlenart.blogspot.com/search?updated-min=2014-01-01T00:00:00-08:00&updated-max=2015-01-01T00:00:00-08:00&max-results=2
będę ogromnie wdzięczna za pomoc
archiwum na pewno nie wyśrodkujesz, bo jest to nie realne, ale warto spróbować jeszcze z takim selektorem .main-inner .column-right-inner {text-align: center;}
UsuńCześć.
OdpowiedzUsuńNie działa mi kod na wyśrodkowanie nagłówka. Znacie może jakiś inny?
siema można zmienić część kolumn np. obniżyć daną część tekstu albo menu, żeby nie przesuwać reszty kolumny, czy muszę to mieć osobno?
OdpowiedzUsuń