Scribd
Upload
10 views

Lecture8 - HTML, CSS, JavaScript

The document discusses internet protocols, IP addresses, DNS, HTTP methods, status codes, HTML structure and tags, CSS properties, JavaScript basics like variables, conditionals and loops, and common events. It provides examples of code for websites, networking, and programming fundamentals.

Uploaded by

Hoàng Minh Thắng
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
10 views

Lecture8 - HTML, CSS, JavaScript

The document discusses internet protocols, IP addresses, DNS, HTTP methods, status codes, HTML structure and tags, CSS properties, JavaScript basics like variables, conditionals and loops, and common events. It provides examples of code for websites, networking, and programming fundamentals.

Uploaded by

Hoàng Minh Thắng
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 98

https://www.youtube.com/watch?

v=
jjR0nsb9Kmw
internet
routers
TCP/IP
IP
#.#.#.#
TCP
80 HTTP

443 HTTPS

...
DNS
Fully Qualified Domain Name IP Address
Fully Qualified Domain Name IP Address
HTTP
HTTPS
https://www.example.com
https://www.example.com/
https://www.example.com/path
https://www.example.com/file.html
https://www.example.com/folder/
https://www.example.com/folder/file.html
https://www.example.com/folder/file.html
https://www.example.com/folder/file.html
https://www.example.com/folder/file.html
https://www.example.com/folder/file.html
https://www.example.com/folder/file.html
GET
POST
...
GET / HTTP/1.1
Host: www.example.com
...
HTTP/1.1 200 OK
Content-Type: text/html
...
GET /search?q=cats HTTP/1.1
Host: www.google.com
...
HTTP/1.1 200 OK
Content-Type: text/html
...
GET / HTTP/1.1
Host: www.harvard.edu
...
HTTP/1.1 301 Moved Permanently
Location: https://www.harvard.edu/
…
HTTP/1.1 404 Not Found
Content-Type: text/html
...
200 OK
301 Moved Permanently
302 Found
304 Not Modified
307 Temporary Redirect
401 Unauthorized
403 Forbidden
404 Not Found
418 I'm a Teapot
500 Internal Server Error
503 Service Unavailable
...
GET / HTTP/1.1
Host: safetyschool.org
...
HTML
tags

attributes
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
http-server
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
hello, body
</body>
</html> hello, title
https://www.example.com
https://www.example.com/path?key=value
https://www.example.com/path?key=value&key=value
https://www.example.com/path
https://www.example.com/path?key=value
GET /search?q=cats HTTP/1.1
Host: www.google.com
...
CSS
properties
type selector

class selector

ID selector

attribute selector

...
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<style>

</style>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
<!DOCTYPE html>

<html lang="en">
<head>
<link href="styles.css" rel="stylesheet">
<title>
hello, title
</title>
</head>
<body>
hello, body
</body>
</html>
frameworks
Bootstrap
getbootstrap.com
JavaScript
conditionals
if (x < y)
{

}
if (x < y)
{

}
if (x < y)
{

}
else
{

}
if (x < y)
{

}
else
{

}
if (x < y)
{

}
else if (x > y)
{

}
else
{

}
if (x < y)
{

}
else if (x > y)
{

}
else
{

}
variables
let counter = 0;
let counter = 0;
counter = counter + 1;
counter = counter + 1;
counter += 1;
counter++;
loops
for (let i = 0; i < 3; i++)
{

}
for (let i = 0; i < 3; i++)
{

}
while (true)
{

}
while (true)
{

}
<!DOCTYPE html>

<html lang="en">
<head>
<title>
hello, title
</title>
</head>
<body>
hello, body
</body> hello, body

</html>

hello, title
blur
change
click
drag
focus
keyup
load
mousedown
mouseover
mouseup
submit
touchmove
unload
...

You might also like