tage

• self closing tage
• opening closeing tage

tages

head -> contain meta data

• meta (name="description", content= "the content")
• title
• meta charset=""

body

button

code

iframe(src) -> set the outside page in my page

h {1.....6} => block

p => block

• strong, b"bold" => inline
• em, i"italic" => inline
• mark => inline
• u"underline" => inline
• small"small text" => inline
• del"deleted" => inline
• ins "inserted text" => inline
• sub"H2O"
• super"x^2"
• br => new line
• hr => horizontal line => block

a (href, target="_blank, _self") -> inline

• link to other site "https://www.google.com"
• to other html file "index.html"
• to id in th pagefile "#id"
• link to email in th pagefile "mailTo:[email protected]"

img (src, alt) -> inline

lists -> block

• ul"unordered list" > li
• ol"ordered list" (reverseed, start, type)> li
• dl"description list" > dt"term" > dd"description"

table

• caption -> to set the title of the table
• thead > tr > th
• tbody > tr > td
• tfooter > tr > td
• (colspan, rowspan)

span -> for catch an element is the page (as

) for styling => inline

div -> container for the styling in css -> block

semantic element(meaning div) -> block element

• header
• nav
• main
• section
• footer
• Aside
• article
• mark
• figure, figurecaption

audio(controles, autoplay, muted, loop) > source(src)

vedio(controles, autoplay, muted, loop, poster=>the image while vedio looding in beginning) > source (src), track(src, kind, srclang)=> for translation

form(action -> path of the backend file, method -> get, post)

• lable(for)
• select(name, multiple) > optiongroup(lablel) > option(value, selected)
• textarea
• input
  => list(name)> datalist> option -example-> (< input list="programming" name="prog">) ====> it is the same with the select but here we can search the element
  => type values -> (text,number, range(min, max, step), password, email, color, file, search, url, date, time, submit, reset, hidden, checkbox(name, value, checked) -> list of option can choose more than one, radio(name, value) -> choose only one but use the name and value)
  => required
  => placeholder
  => value
  => name
  => autofocused
  => readonly
  => disable
  => minlenght, maxlenght

global attribute

• class
• id
• title