<!DOCTYPE html>
<html>
<head>
Meta information goes here!!
<meta charset=UTF-8>
<title>This is title!</title>
</head>
<body>
<!-- This is a comment -->
Contents goes here!!
<h1>Hello!!</h1>
</body>
</html>
/* This is a comment */
/* Tag selector */
p {
text-align: right;
}
/* class attribute selector */
.book-summary {
color: blue;
}
/* id attribute selector */
#site-description {
color: red;
}
- MDN reference - element: https://developer.mozilla.org/en-US/docs/Web/HTML/Element
- MDN reference - button: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button
- MDN reference - image: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img
- doctype declarations: https://developer.mozilla.org/en-US/docs/Web/HTML/Quirks_Mode_and_Standards_Mode
- MDN reference: https://developer.mozilla.org/en-US/docs/Web/CSS/Reference
- CSS trick: https://css-tricks.com/almanac/
- Learn google chrome developer tool: https://developers.google.com/web/tools/chrome-devtools/
- CSS length: https://css-tricks.com/the-lengths-of-css/
- Color - named colors: https://css-tricks.com/snippets/css/named-colors-and-hex-equivalents/
- web safe fonts: https://www.cssfontstack.com/
- How selectors work: https://css-tricks.com/how-css-selectors-work/
- Networking for Web Developers: https://www.udacity.com/course/networking-for-web-developers--ud256
- Sublime Text3
- Atom editors
- Notepad++
- Emacs
- Vi/Vim
- Google Chrome
- Mozilla Firefox