====== CSS ====== Az alábbiak nem a túlzott precizitás igényével készültek. Ha valódi, pontos leírásokra vágysz, akkor látogasd meg a CSS szabvány leírásának [[http://www.w3.org/Style/CSS/|hivatalos honlapját]]! Itt csak néhány emlékeztető példát találsz. ===== A CSS kódok elhelyezése ===== ==== A style paraméterbe ==== Minden HTML elemnek lehet ''sytle'' paramétere, amibe a csak rá vonatkozó stílus leíró utasítások írhatók: Ez egy piros szöveg lesz. ==== A fejlécben ==== Külön CSS állományba ====

===== Fontosabb paraméterek ===== ==== Betűtípus, méret... ====


  p {
    font-family: Times;
    font-size: 16pt;
    font-weight: bold;
    font-style: italic;
    text-decoration: underlined;
    color: red;
  }
  h1 {
    font: bold italic 16px;
    color: blue;
  }

==== Keretezés ====


  p {
    border-width: 0px 1px 2px 3px;
    border-color: red blue;
    border-style: solid dashed dotted solid;
  }
  h1 {
    border: 1px dotted green;
  }

==== Igazítás, margó ====


  p {
    text-align: center;
    margin: 10px 20px;
  }
  h1 {
    margin: 10px;
    padding: 4px 40px 10px 40px;
    text-align: right;
  }

==== Méretezés ====


  img {
    height: 100px;
    width: 200px;
  }

==== Háttér ====


  body {
    background-color: yellow;
    background-image: url(hatter.png);
    background-repeat: repeat-y;
  }

==== Elhelyezés ====


  img { float: left; }
  div { position: absolute; top: 10px; left: 30px; }

==== Táblázat formázása ====


  table { border: 1px solid black; border-spacing: 0px; }
  th { border: 1px solid red; text-align: center; font-weight: bold; }
  td { border: 1px solid blue; text-align: right; }

==== Felsorolás formázása ====


  ol { list-style-type: upper-roman; } /* I, II, III, IV */
  ol { list-style-type: lover-roman; } /* i, ii, iii, iv */
  ol { list-style-type: upper-alpha; } /* A, B, C, ... */
  ol { list-style-type: lover-alpha; } /* a, b, c, ... */
  ol { list-style-type: decimal; }     /* 1, 2, 3, ... */
  ol { list-style-type: decimal-leading-zero; }     /* 01, 02, 03, ... */
  ul { list-style-type: disc; } /* pötty */
  ul { list-style-type: circle; } /* karika */
  ul { list-style-type: square; } /* négyzet */