Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
328 views

HTML Cheatsheet

The document provides reference tables for common HTML and CSS tags including those used for formatting text, creating links, lists, tables, forms, multimedia, and images as well as attributes and values for each tag type. It includes tags for headings, paragraphs, line breaks, comments, sections, and spans as well as bold, italics, deleted text and more. Styles are defined through internal and external CSS using selectors, properties and values to control things like fonts, sizing, positioning, colors and effects.

Uploaded by

Ariful Islam
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
328 views

HTML Cheatsheet

The document provides reference tables for common HTML and CSS tags including those used for formatting text, creating links, lists, tables, forms, multimedia, and images as well as attributes and values for each tag type. It includes tags for headings, paragraphs, line breaks, comments, sections, and spans as well as bold, italics, deleted text and more. Styles are defined through internal and external CSS using selectors, properties and values to control things like fonts, sizing, positioning, colors and effects.

Uploaded by

Ariful Islam
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 2

HTML & CSS Tags Reference Tables

Basic HTML <a href="#ID"> Creates a hyperlink to “ID” in same page


Tag Description Forms and Input
<!DOCTYPE>  Defines the document type Tag Description
<html> Defines an HTML document <form action="/action_page.php"  Defines an HTML form
<head> Contains metadata/information for the document method="get"> for user input
<title> Defines a title for the document <label> Defines a label for an
<body> Defines the document's body <input> element
<h1> to <h6> Defines HTML headings <button name="" id=”” type="" value=""> Defines a clickable
<p> Defines a paragraph button
<br> Inserts a single line break <input name="" id=”” type=”” value="">
<!--...--> Defines a comment type=text/number/ date/ password/ Defines an input control
<div> Defines a section/division of the webpage button/checkbox/radio/ reset/submit
<span> Select a portion of text <textarea name=”” id=”” rows="" cols=""> Defines a multiline text
-- input
Text Formatting <select name="" id=""> Defines a drop-down list
Tag Description <option value="">Option1
<b> Defines bold text <fieldset> Groups related
elements in a form
<del> Defines text that has been deleted from a document
<legend> Defines a caption for a
<i> Defines a part of text in an alternate voice or mood
<fieldset> element
<strong> Defines important text
--
<sub> Defines subscripted text
Audio & Video
<sup> Defines superscripted text
Tag Description
<u> Defines some text that is unarticulated and styled
<audio ‘att1 att2’>
differently from normal text
<source src=" " Defines sound content
--
type=" ”>
List
Attributes and Values
Tag Description
controls Audio controls should be displayed
<ul> Defines an unordered list
loop The audio will start over again
<ol> Defines an ordered list
autoplay Automatically start audio while page load
<li> Defines a list item
src=”URL” Audio file location with extension (.mp3/ .wav)
Attributes and Values
type=" ” Audio file type (“audio/mpeg” or “audio/wav”)
type=" " Bullets Type for ul {circle, square, disk}
Bullets Type for ol {1, I, I, A, a}
start=" " Starting Number for ol <video ‘att1 att2’>
-- <source src=" " Defines a video or movie
Table type=" ”>
Tag Description Attributes and Values
<table> Defines a table controls Video controls should be displayed
<caption> Defines a table caption height Specifies the height of the video window
<th> Defines a header cell in a table width Specifies the width of the video window
<tr> Defines a row in a table loop The video will start over again
<td> Defines a cell in a table autoplay Automatically start video while page load
<thead> Groups the header content in a table src=”URL” Video file location with ext (.mp4 or .ogg)
<tbody> Groups the body content in a table type=" ” Video file type (“video/mp4” or “video/ogg”)
<tfoot> Groups the footer content in a table --
Attributes and Values Style
border=" " Table border in integer {1,2,3,4…..} Tag Description
cellspacing=" " Define space between cell in integer {1,2,3,4…..} style=”” Define In-line CSS on a HTML tag
cellpadding=" " Define space between cell-wall and text in Cell (div/span/p/h1-h6)
colspan=" " Marge no. of column {2,3,4…..} <style> ….</style> Define Internal CSS on class/id or HTML tag
rowspan=" " Marge no. of row {2,3,4…..} in head section
-- <link rel="stylesheet" Define External CSS as stylesheet in head
Graphics/Image href="mystyle.css"> section
Tag Description Attributes and Values
<hr> Inserts a horizontal rule/ line width:50%; Define width of the element in px or %
Attributes and Values height:80px; Define height of the element in px
size= Sets size (height) of horizontal rule font-family: sans-serif; Name of the font used
width= Sets width of rule (as a % or absolute pixel length) font-size=10px Size of the font in px or %
Noshade Creates a horizontal rule without a shadow margin:5px Define space between element
= padding:3px Define space between margin and text
<img> Inserts an Image border: 2px solid red Define border size, color and type
Attributes and Values border-radius:7px Define border edge bending
src="URL File located at the URL border-collapse: Collapse border of a table in single line
" text-align:center Text orientation like left, right, center
alt="" Name of the image text-decoration:none overline, underline, dotted, wavy, blue, 5px
height= Sets height of the image as absolute pixel length (px) color:green Set Text color
width= Sets width of the image as absolute pixel length (px) text-shadow: 2px 2px Text Shadow Horizontal and Vertical value in
-- #FF0000; px and color of the shadow
Links background-color:blue Set Background color of an element
Tag Description float:left Alignment of an Element
<a href=”URL”> Creates a hyperlink to URL table-layout: auto; Table text align as auto/fixed
<a id="IDname"> Creates an id of any section of the page opacity: 0.5; Define object Opacity from 0.0 to 1.0
Author: Engr. M. Ariful Islam (Phone: 01818-23 2003)
M.Sc in Computer Science & Engineering, Lecturer (ICT)
HTML & CSS Tags Reference Tables

Author: Engr. M. Ariful Islam (Phone: 01818-23 2003)


M.Sc in Computer Science & Engineering, Lecturer (ICT)

You might also like