So I just finished my assessment and have been focusing on pure ruby for the past month to get the exercises and fundamentals down. I want to spend the next 2 weeks focusing on the basics of HTML, CSS, and Javascript in order to get a basic understanding on how they will work together. In the interim I would also like to convert www.johnfigueiredo.com into a Custom blog that I will make that will also contain links to github, twitter, and my resume. This should be a fun project for the next couple weeks to give me motivation to work through all of this. I digress...here are some notes about my first night with HTML:
Tags: Everything in html is written with tags <> to open and </> to close with a word in between like <html> </html>. Tags are like parentheses in the fact that they have to be closed at some point and can also nest:
Basics:
<!DOCTYPE html> Selects language for file and computer knows your reading html
<html> Starts html </html>
<head> Head </head>
<title> This is the title </title>
<body> The body of the html </body>
<h1> Creates a new heading </h1> <h6> Goes all the way to h6 which is the smallest </h6>
<p> Creates a new paragraph </p>
<a href="www.johnfigueiredo.com">John's Website Link<a>
<img src="whatever/link.jpg"/>
Ordered and Unordered Lists:
<ol> This creates an ordered list preceded with numbers </ol>
<ul> This creates an ordered list preceded by bullets</ul>
<li> List item with text </li>
Style:
<p style = "font-size: 20px"> Text is 20px </p>
<h2 style="color:red"> Color is red </h2>
<li style="font-family:Bodoni">Changes font</li>
<h1 style="text-align:center">Aligns center</h1>
<strong>Bolds words</strong>
<em> Italicizes </em>
Tables:
<table>Creates a table</table>
<thead>Table Header</thead>
<tr>Creates a table row within a table</tr>
<td>Creates table data within table row</td>
<th>Table head data, is bolded</th>
<th colspan="2">Spans title across multiple columns</th>
Formatting:
<div>Divides up portion of website</div>
<span>Change code with CSS within span</span>
This has been interesting and a confidence boosting exercise. After making an interactive blackjack and hangman game this seems pretty easy and I am picking it up quickly. My goal is to make a custom blog with my resume attached that I can push to heroku and have that be www.johnfigueiredo.com in the next couple weeks. Now I am off to learn more about CSS to start tying this together for styling and the Javascript to make it a bit more interactive.
No comments:
Post a Comment