Okienko wpisu


Gdy wpisujecie sie do ksiegi gosci, albo gdy dodajecie komentarz do notki - zawsze macie takie same biale pola, z taka sama czcionka (Courier New). Mozna to zmienic! Jak? Robi sie to w Arkuszu stylow. W Arkuszu macie juz rozne "dzialy" - np. body, H1, td, a... Aby edytowac okienka wpisu, musicie dodac dwa kolejne dzialy: textarea - odnoszacy sie do duzego okienka, w ktorym wpisujecie komentarz lub tresc wpisu do ksiegi, oraz input - odnoszacy sie do calej reszty, tj. do pol z imieniem, emailem, adresem strony oraz przycisku "Dodaj". Po wiecej informacji (skad wziac kody kolorow - czemu podajemy pare nazw czcionek oddzielonych przecinkami - itd.) zapraszam do dzialu Co jest czym w Arkuszu stylow.



Wpiszcie do Arkusza stylow:

textarea {
background-color: #FFFFFF;
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
width: 228px;
height: 250px;
border-color: #000000;
border-style: solid;
border-width: 1;
padding-left: 10;
padding-right: 0;
padding-top: 10;
padding-bottom: 10;
}

input {
width: 228px;
border-color: #000000;
border-style: solid;
border-width: 1;
font-family: verdana, arial, helvetica, sans-serif;
color: #000000;
background-color: #FFFFFF;
}



Uwaga! Nie musicie wpisywac wszystkich linijek! Jesli ktoras wyrzucicie, zastosowane beda domyslne ustawienia. A teraz po kolei, co jest czym:


1. Dzial TEXTAREA (duze okienko):

   background-color: #FFFFFF;
Okreslacie tu kolor tla w okienku (w przykladzie #FFFFFF czyli bialy).


   color: #000000;
Okreslacie tu kolor czcionki w okienku (w przykladzie #000000 czyli czarny).


   font-family: Verdana, Arial, Helvetica, sans-serif;
Podajemy tu liste czcionek - pierwsza z nich, ktora jest dostepna danemu uzytkownikowi, bedzie uzywana do wpisywania tekstu do tego duzego okienka.


   font-size: 12px;
Rozmiar uzywanej czcionki - w pikselach. Najlepiej podac 12px (ew. 11 lub 13).


   width: 228px;
Szerokosc duzego okienka, w pikselach. Nie musicie wpisywac tej linijki jesli odpowiada Wam domyslna szerokosc.


   height: 250px;
Wysokosc duzego okienka, w pikselach. Nie musicie wpisywac tej linijki jesli odpowiada Wam domyslna wysokosc.


   border-color: #000000;
Kolor obramowania okienka. W przykladzie #000000 czyli czarny.


   border-style: solid;
Okreslacie tu rodzaj obramowania (w przykladzie - solid czyli linia ciagla).


   border-width: 1;
Szerokosc obramowania, w pikselach. Nie przesadzajcie! 1 czy 2 piksele w zupelnosci wystarczy :)


   padding-left: 10;
Odleglosc miedzy wpisywanym w okienko tekstem a obramowaniem z lewej strony, w pikselach.


   padding-right: 0;
Odleglosc miedzy wpisywanym w okienko tekstem a obramowaniem z prawej strony, w pikselach. Wpisalam 0, poniewaz z prawej strony i tak jest dosyc duzy odstep - jest przeciez suwak do przewijania!


   padding-top: 10;
Odleglosc miedzy wpisywanym w okienko tekstem a obramowaniem z gory, w pikselach.


   padding-bottom: 10;
Odleglosc miedzy wpisywanym w okienko tekstem a obramowaniem z dolu, w pikselach.



2. Dzial INPUT (male pola, przycisk "Dodaj"):

   width: 228px;
Szerokosc okienka wpisu, w pikselach. UWAGA!!! Pamietajcie, ze zmiana dotyczy tez przycisku "Dodaj"! Przycisk sie Wam rozszerzy - i bedzie troche wystawal z lewej strony (nic na to nie poradze, to kwestia ustawien, do ktorych dostep ma tylko Adomas - jesli wrzuci przycisk "Dodaj" do tabelki, nic nie bedzie wystawac :)))


   reszta ustawien
...patrz wyzej.