HTML/Basic Code
From r00tedvw.com wiki
(Difference between revisions)
(23 intermediate revisions by one user not shown) | |||
Line 19: | Line 19: | ||
<nowiki><p> | <nowiki><p> | ||
</p></nowiki> | </p></nowiki> | ||
+ | Tags to add image | ||
+ | <nowiki><img src="http://image"/></nowiki> | ||
+ | Tags to add text link | ||
+ | <nowiki><a href="http://html link"></a></nowiki> | ||
+ | Tags to add image link | ||
+ | <nowiki><a href=""><img src="http://image link"/></a></nowiki> | ||
+ | Tags for a numbered list | ||
+ | <nowiki><ol> | ||
+ | <li></li> | ||
+ | </ol></nowiki> | ||
+ | Tags for a unordered list (bullet points) | ||
+ | <nowiki><ul> | ||
+ | <li></li> | ||
+ | </ul></nowiki> | ||
+ | Comments | ||
+ | <nowiki> <!-- comment --></nowiki> | ||
+ | Styles<br\> | ||
+ | Style attributes work with most tags | ||
+ | <nowiki>style="attribute;" | ||
+ | ex. font-family: Impact | ||
+ | ex. font-size: 16px | ||
+ | ex. font-size: 2em | ||
+ | ex. color: green</nowiki> | ||
+ | |||
+ | <nowiki><li style="font-family: impact;font-size: 16px;color: green">Test text</li> | ||
+ | <li style="font-family: impact;font-size: 2em;color: green">Test text</li> | ||
+ | |||
+ | em allows you to specify the size in relationship the viewer's browser. Good practice to use so that mobile users aren't restricted to a specific pixel size. | ||
+ | </nowiki> | ||
+ | Text attributes | ||
+ | <nowiki><strong>Bold</strong> | ||
+ | <em>Italics</em></nowiki> | ||
+ | Div<br\> | ||
+ | Allows you to break up page into containers | ||
+ | <nowiki><div></div></nowiki> | ||
+ | Table | ||
+ | <nowiki><table>Table Attributes go here</table></nowiki> | ||
+ | Table Attributes | ||
+ | <nowiki><tr>Table Row</tr> | ||
+ | <td>Table Data</td> | ||
+ | <thead>Table Header</thead> | ||
+ | <th>Table Header Data</th> | ||
+ | <colspan="column number"> Add to either td or th to expand the row X number of columns</nowiki> | ||
+ | Table structure | ||
+ | <nowiki><html> | ||
+ | <body> | ||
+ | <table> | ||
+ | <thead> | ||
+ | </thead> | ||
+ | <tbody> | ||
+ | </tbody> | ||
+ | <tfoot> | ||
+ | </tfoot> | ||
+ | </table> | ||
+ | </body> | ||
+ | </html></nowiki> | ||
+ | |||
+ | |||
+ | |||
+ | ==Hex Color Codes== | ||
+ | Notice the pattern | ||
+ | ;red | ||
+ | :FF0000 | ||
+ | ;green | ||
+ | :00FF00 | ||
+ | ;blue | ||
+ | :0000FF | ||
+ | ;white | ||
+ | :FFFFFF | ||
+ | ;black | ||
+ | :000000 |
Latest revision as of 11:51, 26 November 2018
Top of every page, defines that it is a file with HTML code in it
<!DOCTYPE HTML>
Tags that define HTML code
<html> </html>
Tags that define the head of the page
<head> </head>
Tags that define the title of the head
<title> </title>
Tags that define the body of the page
<body> </body>
Tags that define the heading of text. large number = large text, lower number = smaller text. All text within heading is bold.
<h1> </h1>
Tags that define the a paragraph
<p> </p>
Tags to add image
<img src="http://image"/>
Tags to add text link
<a href="http://html link"></a>
Tags to add image link
<a href=""><img src="http://image link"/></a>
Tags for a numbered list
<ol> <li></li> </ol>
Tags for a unordered list (bullet points)
<ul> <li></li> </ul>
Comments
<!-- comment -->
Styles
Style attributes work with most tags
style="attribute;" ex. font-family: Impact ex. font-size: 16px ex. font-size: 2em ex. color: green
<li style="font-family: impact;font-size: 16px;color: green">Test text</li> <li style="font-family: impact;font-size: 2em;color: green">Test text</li> em allows you to specify the size in relationship the viewer's browser. Good practice to use so that mobile users aren't restricted to a specific pixel size.
Text attributes
<strong>Bold</strong> <em>Italics</em>
Div
Allows you to break up page into containers
<div></div>
Table
<table>Table Attributes go here</table>
Table Attributes
<tr>Table Row</tr> <td>Table Data</td> <thead>Table Header</thead> <th>Table Header Data</th> <colspan="column number"> Add to either td or th to expand the row X number of columns
Table structure
<html> <body> <table> <thead> </thead> <tbody> </tbody> <tfoot> </tfoot> </table> </body> </html>
[edit] Hex Color Codes
Notice the pattern
- red
- FF0000
- green
- 00FF00
- blue
- 0000FF
- white
- FFFFFF
- black
- 000000