27 czerwca 2015

Dla początkujących: na czym to polega?

Witam! Dzisiaj dosyć krótka notka, dla tych którzy dopiero zaczynają z blogspotem. Zaczęły się wakacje, dlatego notki będą tutaj częściej umieszczane. Miałam zacząć czymś kompletnie innym, ale powiedziałam sobie, że najpierw kilka objaśnień a potem to co już przyjemniejsze.

A więc, kody CSS to nic innego jak proste rozkazy jakie ma wykonać dana przeglądarka bądź strona. A w jeszcze prostszym wytłumaczeniu, są to proste treści (w języku angielskim), które powodują, że strona lub w naszym przypadku blog, zmieniają, ustawiają, kolorują i co tylko się nam zapragnie.

Gdzie wpisać dany kod?
Należy wejść, w PROJEKT → DOSTOSUJ → ZAAWANSOWANE → DODAJ ARKUSZ CSS.

Następnie to jaki kod napiszemy, zależy tylko od nas. 

Z czego składa się taki kod?
Na początku należy podać selektor, czyli nazwę danej "rzeczy", którą chcemy zmienić. Każda, kolumna czy napis ma swoją oddzielną nazwę, więcej o selektorach TU.
Po selektorze, należy otworzyć nawias klamrowy "{" następnie wpisujemy cechę, czyli zmianę jakiej chcemy dokonać. Kolejną rzeczą jest wartość, jaką nadajemy temu wszystkiemu i na koniec stawiamy średnik i zamykamy nawiasem klamrowym. Dla przykładu, żeby bardziej wam to objaśnić.
.post {background: #000000;}
Czerwonym kolorem zaznaczyłam nasz selektor, w tym przypadku jest to po prostu nasz post, otworzyłam nawias i wpisałam cechę, background - czyli z angielskiego tło, a następnie wartość czyli kolor i zamknęłam nawias.
h3.post-title {font-size: 24px;}
W kolejnym przykładzie mamy taką samą sytuację, tylko tutaj selektorem jest tytuł posta, za nawiasem mamy font-size - czyli rozmiar czcionki, i następnie wartość czyli 24px. Pamiętajcie, gdy piszecie rozmiar czegokolwiek to za liczbą zawsze musi znajdować się px.

Mam nadzieję, że chociaż trochę objaśniłam wam na czym to wszystko polega. Od tego zaczynajcie, stwórzcie próbnego bloga i bawcie się kodami, sprawdzając je i testując bo głównym sposobem na obcykanie się w tej kwestii jest po prostu próbowanie. Także powodzenia!

Brak komentarzy:

Prześlij komentarz