HTML
HTML
翻译成代码如下：
web：
import socket
def handle_request(client):
buf = client.recv(1024)
client.sendall(bytes("HTTP/1.1 201 OK\r\n\r\n","utf8"))
client.sendall(bytes("<h1>Hello, World</h1>","utf8"))
def main():
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.bind(('localhost',8082))
sock.listen(5)
while True:
connection, address = sock.accept()
handle_request(connection)
connection.close()
if __name__ == '__main__':
main(
web：
import socket
def handle_request(client):
buf = client.recv(1024)
client.sendall(bytes("HTTP/1.1 201 OK\r\n\r\n","utf8"))
client.sendall(bytes("<h1>Hello, World</h1>","utf8"))
def main():
sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
sock.bind(('localhost',8082))
sock.listen(5)
while True:
connection, address = sock.accept()
handle_request(connection)
connection.close()
if __name__ == '__main__':
main()
html css 以及js的关系
HTML 是什么？
htyper text markup language 即超文本标记语言
超文本: 就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。
标记语言: 标记（标签）构成的语言.
网页==HTML文档，由浏览器解析，用来展示的
静态网页：静态的资源，如xxx.html
动态网页：html代码是由某种开发语言根据用户请求动态生成的
html文档树形结构图
什么是标签:
- 是由一对尖括号包裹的单词构成 例如: <html> *所有标签中的单词不可能以数字开头.
- 标签不区分大小写.<html> 和 <HTML>. 推荐使用小写.
- 标签分为两部分: 开始标签<a> 和 结束标签</a>. 两个标签之间的部分 我们叫做标签体.
- 有些标签功能比较简单.使用一个标签即可.这种标签叫做自闭和标签.例如: <br/> <hr/> <input /> <img />
- 标签可以嵌套.但是不能交叉嵌套. <a><b></a></b>
标签的属性:
- 通常是以键值对形式出现的. 例如 name="alex"
- 属性只能出现在开始标签 或 自闭和标签中.
- 属性名字全部小写. *属性值必须使用双引号或单引号包裹 例如 name="alex"
- 如果属性值和属性名完全一样.直接写属性名即可. 例如 readonly
python服务器开启一个socket端口，传入test.html
import socket
def main():
sock = socket.socket(socket.AF_INET,socket.SOCK_STREAM)
sock.bind(('localhost',8089))
sock.listen(5)
while True:
connection, address = sock.accept()
buf = connection.recv(1024)
f = open("test.html","rb")
data = f.read()
connection.sendall(bytes("HTTP/1.1 201 OK\r\n\r\n","utf8"))
connection.sendall(data)
connection.close()
if __name__ == "__main__":
main()
<!DOCTYPE html>
<strong lang="en">
<head>
<meta http-equiv="content-type" charset="UTF-8">
<title>Title</title>
<!-- <meta http-equiv="refresh" content="2;URL=http://www.baidu.com"> -->
<link rel="icon" href="//www.jd.com/favicon.ico" mce_href="//www.jd.com/favicon.ico" type="image/x-icon">
</head>
<br>
<h1 name="alex">hello world 1</h1>
<h2>hello world 2</h2>
<h3>hello world 2</h3>
<h4>hello world 2</h4>
<h5>hello world 2</h5>
<h6>hello world 2</h6>
<h2>咏鹅 </h2>
<p> 鹅鹅鹅 </p>
<p>曲项向天歌</p>
<p>白毛浮绿水</p>
<p>红掌拨清波</p>
鹅鹅鹅</br>
曲项向天歌</br>
白毛浮绿水</br>
红掌拨清波</br>
<b>飞流直下三千尺</b>
<strong>飞流直下三千尺</strong>
<strike>hello</strike>
<em>斜体</em>
2<sub>2</sub>
3<sup>3</sup>
<hr>
<h1 style="color:red">hello h1</h1>
<div style="color:green;background-color:aquamarine;height:100px;width:50%;font-size:40px;text-align:center">hello</div>
<span style="background-collor: rebeccapurple"> hell span </span>
<h2 style="background-color:rebeccapurple"> h2h2h2h2hh2 </h2>
块级标签       和内联标签
<>©®
<input type="text" readonly="readonly">
<img src="unsplash.jpg" >
</body>
</html>
列表实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div id="abc">顶部</div>
<img src="unplash.jpg" title=" 京东" width="200px" height="200px">
<a href="http://www.521609.com/daxuexiaohua/" target="_blank"> xiao huawang</a>
unorder list
<ul>
<li>1111</li>
<li>2222</li>
<li>33333</li>
</ul>
order list
<ol>
<li>1111</li>
<li>2222</li>
<li>33333</li>
</ol>
<dl>
<dt>第一章</dt>
<dd>第一节</dd>
<dd>第二节</dd>
<dd>第三节</dd>
</dl>
<a href="#abc">返回顶部</a>
</body>
</html>
form表单