Udemy에서 Build Your First Website in 1 Week with HTML5 and CSS3 강의를 듣고 정리한 것이다.
Basic
HTML(Markup language) : It controls the structure of the site’s code.
Structure
<!DOCTYPE html>
<html>
<!-- <head></head> section is background info,
include behind the scenes info -->
<head>
<title> My Blog </title>
</head>
<!-- <body></body> section is everything
you see on the screen -->
<body>
<h1> Hello World </h1>
<!-- h1 : element
<h1> : opening tag
</h1> : closing tag -->
<a href="http://google.com"> Go google </a>
<!-- href : attributes,
always defined name/value pair -->
</body>
</html>
Path
<!-- folder directory -->
.first-site
+-- css
| --- bootstrap.min.css
| --- custom.css
+-- fonts
+-- js
--- index.html
<!-- index.html -->
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<!-- href="
css : The browser to look for the "css" folder in the same directory
/ : Once "css" folder is found, go into it
bootstrap.min.css : Then find "bootstrap.min.css"
" -->
DIV
element는 Block element와 Inline element가 있다.
- Block element : start and end with a new line when displayed in browser. (examples : <div> <li>, <h1>, <p>)
- Inline element : are displayed without starting a new line. (examples : <img>, <a>, <strong>)
DIV is used to group block elements for styling purpose. DIV also block element.
Span
group inline elements in a document.
<strong>strong <span style="color:red">red</span> text.</strong>