html/styl.css
author František Kučera <franta-hg@frantovo.cz>
Sat May 23 21:33:25 2009 +0200 (2009-05-23)
changeset 4 49903d1fe188
parent 3 35e9706113b0
child 5 71c6de7f0a38
permissions -rw-r--r--
Logo (první verze: „SQL: tenhle jazyk tě bude bavit!“) a ikonky pro ok, varování, chybu nebo tip u výsledku.
     1 /** Obrázky s odkazem bez rámečku */
     2 a img {
     3     border: none;
     4 }
     5 
     6 /** Pozadí stránky a text */
     7 html {
     8     background: #42afdc;
     9     color:black;
    10 }
    11 
    12 /** Bezpatkové písmo */
    13 body {
    14     font-family: sans-serif;
    15 }
    16 
    17 /** Prostor pro logo a název programu */
    18 #zahlavi {
    19     height: 48px;
    20     background-image: url('grafika/logo.png');
    21     background-repeat: no-repeat;
    22     margin-left: 5px;
    23 }
    24 
    25 #zahlavi h1 {
    26     display: none;
    27 }
    28 
    29 /** Obal kolem bloků */
    30 #bloky {
    31     width: 1040px;
    32     text-align: justify;
    33 }
    34 
    35 .blok {
    36     margin: 10px;
    37 }
    38 
    39 /** Vstup, výstup nebo nápověda */
    40 .vnitrekBloku {
    41     background-image: url('grafika/blok-pozadi.gif');
    42     margin: 0px;
    43     padding: 10px;
    44 }
    45 
    46 #vstup .vnitrekBloku {
    47     height: 150px;
    48     text-align: right;
    49 }
    50 
    51 #vstup textarea {
    52     width: 640px;
    53     height: 108px;
    54     padding: 8px;
    55     border: 1px solid silver;
    56 }
    57 
    58 #vstup button {
    59     width: 146px;
    60     height: 20px;
    61     border: none;
    62     background-image: url('grafika/tlacitko-sql.png');
    63     margin-right: 0px;
    64     margin-top: 5px;
    65     padding: 0px;
    66     cursor: pointer;
    67 }
    68 
    69 #vystup .vnitrekBloku {
    70     overflow: auto;
    71     height: 280px;
    72 }
    73 
    74 #napoveda .vnitrekBloku {
    75     height: 484px;
    76 }
    77 
    78 /** Nadpisy bloků */
    79 .blok h2 {
    80     font-size: 12px;
    81     padding: 2px;
    82     padding-top: 4px;
    83     padding-left: 32px;
    84     margin: 0px;
    85     color: gray;
    86     height: 20px;
    87 }
    88 
    89 #napoveda h2 {
    90     background-image: url('grafika/blok-nadpis-320.png');
    91 }
    92 
    93 /** Vstupně-výstupní část */
    94 #io {
    95     float: left;
    96 }
    97 
    98 #io h2 {
    99     background-image: url('grafika/blok-nadpis-680.png');
   100 }
   101 
   102 /** Blok vstupu */
   103 #vstup {
   104     width: 680px;
   105 }
   106 
   107 /** Blok výstupu */
   108 #vystup {
   109     width: 680px;
   110 }
   111 
   112 /** Blok nápovědy */
   113 #napoveda {
   114     float: right;
   115     width: 320px;
   116 }
   117 
   118 /** Formátování (výstupní) tabulky */
   119 table {
   120     border: 1px solid green;
   121     border-collapse:collapse;
   122 }
   123 
   124 td {
   125     border: 1px solid black;
   126     padding: 4px;
   127     padding-left: 8px;
   128     padding-right: 8px;
   129 }
   130 
   131 td.cislo {
   132     text-align: right;
   133 }
   134 
   135 thead {
   136     background: silver;
   137     font-weight:bold;
   138 }
   139 
   140 thead td a {
   141     color: black;
   142     text-decoration: none;
   143 }
   144 
   145 /** Ikonky pro zprávu k výsledku */
   146 #vystupniPole p {
   147     background-repeat: no-repeat;
   148     padding-left: 22px;
   149 }
   150 
   151 #vystupniPole p.vysledekOK {
   152     background-image: url('grafika/vysledek-ok.png');
   153 }
   154 
   155 #vystupniPole p.vysledekVarovani {
   156     background-image: url('grafika/vysledek-varovani.png');
   157 }
   158 
   159 #vystupniPole p.vysledekChyba {
   160     background-image: url('grafika/vysledek-chyba.png');
   161 }
   162 
   163 #vystupniPole p.vysledekTip {
   164     background-image: url('grafika/vysledek-tip.png');
   165     color: gray;
   166     font-style: italic;
   167 }