一、HTML

1、web server

import socket

def handle_request(client):

    buf = client.recv(1024)

    client.send(bytes("HTTP/1.1 200 OK\r\n\r\n", encoding='utf-8'))

    client.send(bytes("<h1 style='background-color:red;'>Hello, Seven<h1>", encoding='utf-8'))

def main():

    sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)

    sock.bind(('localhost', 9999))

    sock.listen(5)

    while True:

        conn, addr = sock.accept()

        handle_request(conn)

        conn.close()

if __name__ == '__main__':

    main()

2、web server2

import socket

def handle_request(client):

    buf = client.recv(1024)

    client.send(bytes("HTTP/1.1 200 OK\r\n\r\n", encoding='utf-8'))

    f = open('index', 'rb')

    data = f.read()

	f.close()

    client.send(data)

def main():

    sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)

    sock.bind(('localhost', 9999))

    sock.listen(5)

    while True:

        conn, addr = sock.accept()

        handle_request(conn)

        conn.close()

if __name__ == '__main__':

    main()

3、实例index.html

<h1 style='background-color:red;'>Hello, Seven<h1>

<a href='http://www.baidu.com'>baidu</a>

<table border='1'>

    <tr>

        <td>1</td>

        <td>2</td>

        <td>3</td>

    </tr>

<table>

4、head标签

  • meta 标签：编码、跳转、刷新、关键字、描述、IE兼容
<!DOCTYPE html>

<html lang="en">

<head>

    <meta http-equiv="content-type" content="text/html;charset=utf-8">  <!-- 页面编码 -->

    <meta http-equiv="Refresh" content="60">  <!-- 60s自动刷新一次页面 -->

    <!--<meta http-equiv="Refresh" content="5; url=http://www.baidu.com" />  5s后跳转到目标网站-->

    <meta name="keywords" content="dongfei,dongfei2">

    <meta http-equiv="X-UA-Compatible" content="IE=IE9;IE=IE8" />

    <title>Title</title>

</head>

<body>

    <h1>welcome dongfei web site.</h1>

</body>

</html>
  • title标签
  • link标签：加图标
<link rel="shortcut icon" href="image/favicon.ico">  <!--给网站加图标-->
  • style
  • script

5、body标签

5.1：各种符号

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>dongfei</title>

</head>

<body>

    <a href="http://www.baidu.com">百&nbsp;&nbsp;&nbsp;&nbsp;&gt;度</a>

    <h3>静夜思</h3>

    <h5>作者：李白</h5>

    <p>床前明月光，<br/>疑似地上霜。<br/>举头望明月，<br/>低头思故乡。</p>

    <span>dongfei</span>

</body>

</html>

5.5：div标签，块级白板

6、表单标签

  • from标签
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>login</title>

</head>

<body>

    <form action="http://localhost:xxx/index" method="get">  <!-- 向后端提交表单 -->

        <input type="text" name="username"/>

        <input type="text" name="email"/>

        <input type="password" name="password"/>

        <input type="button" value="login"/>  <!--button默认没有任何功能-->

        <input type="submit" value="login2"/>

    </form>

</body>

</html>
  • 提交至搜索引擎
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>sougou</title>

</head>

<body>

    <form action="https://www.sogou.com/web" method="get">

        <input type="text" name="query" value="sogou"/>  <!--value:默认值-->

        <input type="submit" value="搜索">

    </form>

</body>

</html>
  • 单选框&复选
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <form>

        <div>

            <p>请选择性别：</p>

                男：<input type="radio" name="gender" value="1" checked="checked" />

                女：<input type="radio" name="gender" value="2" />

            <p>爱好：</p>

            篮球：<input type="checkbox" name="favor" value="1" />

            足球：<input type="checkbox" name="favor" value="2" />

            乒乓球：<input type="checkbox" name="favor" value="3" />

        </div>

        <input type="submit" value="提交" />

    </form>

</body>

</html>
  • 上传文件&重置表单
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <form enctype="multipart/form-data">

        <div>

            <p>上传文件：</p>

            <input type="file" name="fname">

        </div>

        <input type="submit" value="upload">

        <input type="reset" value="reset">

    </form>

</body>

</html>
  • 多行文本输入
<textarea name="menu" >默认值</textarea>
  • 下拉框：select标签
        <select name="city" multiple="multiple" size="3">

            <option value="1">北京</option>

            <option value="2" selected="selected">上海</option>

            <option value="3">广州</option>

        </select>

        <input type="submit" value="提交">

7、超链接&锚点

<a href="http://www.baidu.com" target="_blank">百度</a>


<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <a href="#i1">第一章</a>

    <a href="#i2">第二章</a>

    <a href="#i3">第三章</a>

    <a href="#i4">第四章</a>

    <div id="i1" style="height:600px;">第一章的内容</div>

    <div id="i2" style="height:600px;">第二章的内容</div>

    <div id="i3" style="height:600px;">第三章的内容</div>

    <div id="i4" style="height:600px;">第四章的内容</div>

</body>

</html>

8、图片

    <a href="http://www.baidu.com">

        <img src="1.jpg" style="height: 200px;width: 200px;" alt="风景" title="风景">

    </a>

9、列表

    <ul>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

    </ul>

    <ol>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

    </ol>

    <dl>

        <dt>123</dt>

        <dd>456</dd>

    </dl>

10、表格

    <table border="1">

        <tr>

            <td>第一行，第一列</td>

            <td>第一行，第二列</td>

            <td>第一行，第三列</td>

        </tr>

        <tr>

            <td>第二行，第一列</td>

            <td>第二行，第二列</td>

            <td>第二行，第三列</td>

        </tr>

    </table>


<table border="1">

    <thead>

        <tr>

            <th>表头1</th>

            <th>表头2</th>

            <th>表头3</th>

            <th>表头4</th>

        </tr>

    </thead>

    <tbody>

        <tr>

            <td>内容1</td>

            <td>内容2</td>

            <td>内容3</td>

            <td>内容4</td>

        </tr>

    </tbody>

</table>
  • 合并单元格
<td colspan="2">内容2</td>


<td rowspan="2">内容2</td>

11、label标签

    <label for="username">用户名：</label>

    <input id="username" type="text" name="user" />

191121HTML的更多相关文章

随机推荐

  1. U盘重装系统

    一.准备工作 (1)8G以上空间的U盘一个: (2)将U盘制作好启动工具: 1.下载启动工具制作软件(常用的有:大白菜.电脑店.老毛桃.快启动等等一系列软件,直接百度这些软件的名称,或者百度U盘启动制 ...

  2. 网速监控-nload

    用来监控系统网卡实时网速的. 安装 yum install nload -y # 或 apt install nload -y 使用 # 直接运行默认监控第一个网卡, 使用上下方向键来切换网卡. nl ...

  3. 帝国cms 描述和关键词动态获取

    之前列表页首页和内容页调用的关键词和描述的字段不一样,所以说需要写好几套模板. 下边这个判断就不用像之前做几套模板了,通过判断获取不一样的字段. $GLOBALS[navinfor] 这个判断的是此页 ...

  4. 多线程之实现Runnable接口及其优点

    多线程之实现Runnable接口: 1.创建一个Runnable接口的实现类 2.在实现类中重写Runnable接口的run方法 3.创建一个Runnable接口实现类的对象 4.创建Thread类对 ...

  5. 基于 docker容器搭建机器学习环境

    下载docker镜像 docker pull ubuntu:18.04 进入ubuntu系统命令 docker run -ti ubuntu /bin/bash 正确退出系统方式 先按,ctrl+p ...

  6. redis集群启动和关闭脚本

    创建startall.sh /usr/local/redis/bin/redis-server /usr/local/redis/redis-cluster/7001/redis.conf /usr/ ...

  7. 了解并安装Nginx

    公司使用nginx作为请求分发服务器,发现本人在查看nginx配置上存在些许困难,故仔细阅读了陶辉的<深入理解nginx模块开发与框架>第一部分,并作此记录. 了解 我根据书上的思路来了解 ...

  8. 51单片机通过ESP8266模块与手机进行通讯（单片机）

    相关连接和资料下载: 个人博客 资料下载 Step1:配置ESP8266 通过USB转TTL模块把ESP8266模块和电脑连接起来,如图: 把ESP8266模块的VCC,GND,CH_PD,UTXD, ...

  9. CISCO SMARTnet服务和SMB服务技术支持

    点击官网:SMB Support Assistant技术支持服务 点击官网:思科SMARTnet快速维护及快速维护现场服务 一.SMARTnet服务 1.1 标准SMARTnet 服务级别:5*8*N ...

  10. hdu4507 吉哥系列故事——恨7不成妻[数位DP]

    这题面什么垃圾玩意儿 首先看到问题格式想到数位DP,但是求的是平方和.尝试用数位DP推出. 先尝试拼出和.设$f[len][sum][mod]$表示填到$len$位,已填位置数位和$sum$,数字取余 ...