0% found this document useful (0 votes)
7 views2 pages

HTML Notes

The document provides an overview of HTML elements and their usage, including body, paragraphs, tables, and styling attributes. It explains how to structure tables with headers, footers, and data cells, as well as how to apply styles for alignment and appearance. Additionally, it covers linking external stylesheets and specifying font and background properties in CSS.

Uploaded by

hanshikak0307
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views2 pages

HTML Notes

The document provides an overview of HTML elements and their usage, including body, paragraphs, tables, and styling attributes. It explains how to structure tables with headers, footers, and data cells, as well as how to apply styles for alignment and appearance. Additionally, it covers linking external stylesheets and specifying font and background properties in CSS.

Uploaded by

hanshikak0307
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd

<!

--comments are written like this-->


<body> objects between these tags are usually displayed in the webpage </body>
<p> text is organized into paragraphs. They have six different heading styles from
h1 to h6. </p>
<sup> superscript </sup>
<sub> subscript </sub>
<table> tables in HTML always start with these tags. </table>
<caption> allows you to display a caption above the table. It must be the first
HTML tag after the <table> tag </caption>
<tr> splits the table into rows </tr>
<td> between <tr> tag, place this tag. A row can have one or more table datas
</td>
<table border="1"> shows the table gridlines. This value can be more than 1 too. It
doesnt end with "border" attribute again </table>
<thead> header of the table </thead>
<tfoot> footer of the table </tfoot>
<tbody> body of the table </tbody>
<th> table headings: Use these ONLY in table header. Dont use it in footer or body
section, instead use table data tag </th>
<table style="width:400px"> can be applied to table row and table data tags too. it
is the fixed width </table>

Styles to Tables (apply style attribute)


"margin-left:auto;margin-right:auto;" ---> center aligning a table
"height:60px"---> sets a fixed height. can be applied to table rows
"text-align:center"---> aligns the text to the center
"border-collapse:collapse"---> border with single line
"border: solid 4px"---> can be added to table tag for external grid. can be added
to <th> and <td> tags for internal grid
"vertical-align:(value = top, middle, or bottom)"---> vertically aligns the table
cell contents
"colspan="3""--->spans across all 3 columns in a row. applied in <td> tag

Attach an external stylesheet to a web page:


<link rel="stylesheet" type="text/css" href="_______.css"> it should right below
the title tag inside the head tag

Add comments to the stylesheet:


/*comments in stylesheet*/

Specify font properties:


"font-family:(serif or sans-serif)"--->Add the font name too (if asked)
"font-size:(points, picas or pixels)"---> it can be in any format (pt, pc or px)
"text-align:(lefft, right, center or justify)"---> alignment of the text in the web
page
"font-weight:bold"---> changes the text to bold
"text-decoration:underline"---> add a line under the text
"color:(value)"---> changes the colour of the text

Specify background properties:


"backgound-color:(value)"
"background image: url("__________")"---> allows you to add image as background.
Use a saved image and add extension
"background-repeat:(repeat or no-repeat)"---> tiles the image
"class"--->By defining CSS rules for a specific class name (prefixed with a dot),
those styles are applied to elements that have that class assigned.

You might also like