HTML5 and CSS3

less than 1 minute read

html

<!DOCTYPE html>
<html>
  <head>
    <title>This is title of this page.</title>
  </head>
  <body>
    <header></header>
    <nav></nav>

    <section></section>
    <article></article>
    <aside></aside>

    <footer></footer>
  </body>
</html>

tags

  • headline : h1, h2, h3, h4, h5, h6
  • list : ol, ul, dl, li
  • table : table, caption, thead, tbody, tfoot, tr, th, td
  • input : input (type, name, onclick)
      type : radio
    
  • hyperlink : a (href, target, download)
    target: _blank, _self, _parent, _top
    
  • media : img (src, alt)
  • frame : iframe(src, srcdoc, name, width, height)
  • Semantic elements
Special Character
 - < : &lt; or &#60;

Block tag : <p>, <h1>, <div>, <ul>
Inline tag : <strong>, <a>, <img>, <span>

Radio Button

<input type="radio" name="display_radio" onclick="setDisplay(0);">Auto</input>
<input type="radio" name="display_radio" onclick="setDisplay(1);" checked="checked">Display1</input>
<input type="radio" name="display_radio" onclick="setDisplay(2);">Display2</input>

CSS

CSS Selectors

  • .class
  • .class1.class2
  • #id
  • *
  • element
  • element.class
  • element,element
  • element element
  • element>element
  • element+element
  • element1~element2
  • [attribute]
  • [attribute=value]
  • [attribute~=value]
  • [attribute!=value]
  • [attribute^=value]
  • [attribute$=value]
  • [attribute*=value]
  • :active
  • :focus
  • :hover

position

  • static : default
  • absolute
  • relative
  • fixed
  • sticky
  • initial
  • inherit

CSS Selectors Reference

position

Tags:

Categories:

Updated:

Leave a comment