---恢复内容开始---

web服务本质

import socket

sock=socket.socket()

sock.bind(('127.0.0.1',))

sock.listen()

where True:

    conn.addr=sock.accept()

    data=conn.recv()

    print(data.decode('utf8'))

    with open('index.html'.'r') as f:

        data=f.read()

    conn.send(('HTTP/1.1 200 ok\r\n\r\n %s'%data).encode('utf8'))

    conn.close()

HTTP/1.1 201 ok\r\n\r\n 是需要改善的内容：为也给浏览器看的

html

定义

　　超文本标记语言。是通过标签语言来标记要显示的网页中的各个部分。一套浏览器认识的规则。

结构

　　1.<html></html>是文档的开始标记和结束标记。此元素告诉浏览器其自身是一个HTML文档

在它们之间是文档的头部<head>和主体<body>.

　　2.它们之间的内容不会在浏览器的文档窗口显示，但是期间的元素有特殊重要的意义。

　　3.<title></title> 定义网页标题，在浏览器标题栏显示 

　　4.<body></body> 之间的文本是可见的网页主体内容　

html标签格式

　　1.由尖括号包围的关键词

　　2.通常是成对出现的（双边标记），比如<div>和</div>　

　　3.标签不区分大小写　

　　4.标签分为开始和结束两部分标签之间的内容我们叫做标签体<a> </a>。有些标签功能比较简单，使用一个标签即可，这种标签叫做自闭和标签。<br/><hr/><img/>

　　5.标签可以嵌套但是不能交叉嵌套；

标签的语法

　　<标签名 属性1=‘属性值1’属性2=‘属性值2’……>内容部分</标签名>

　　<标签名 属性1=‘属性值1’属性2=‘属性值2’……/>

常用标签

1.<!DOCTYPE>标签 h5格式

　　声明位于文档中的最前面的位置，处于<html> 标签之前。此标签可告知浏览器文档使用哪种 HTML或XHTML规范

　　1.BackCompat:怪异模式，浏览器使用自己的怪异模式解析渲染页面。

　　2.CSS1Compat: 标准模式，浏览器使用W3C的标准解析渲染页面

2.<head>内常用标签 头部

　　　　<meta>标签位于文档的头部，不包含任何内容，提供的信息是用户不可见的

　　　　meta 标签共有两个属性，它们分别是http-equiv 属性和 name 属性，不同的属性有不同的参数值，这些不同的参数值实现了不同的网页功能。

　　　　name属性主要用于描述网页，与之对应的属性值为content,content中的内容主要是便于搜索收获机器人查找信息和分类信息用的。

<meta name="keywords" content="meta总结,html meta,meta属性,meta跳转">

<meta name="description" content="老男孩培训机构是由一个很老的男孩创建的">

　　　http-equiv 属性：相当于http 的文件头作用，它可以向浏览器传回一些有用的信息以帮助正确地显示网页内容与之相对的属性值为content,content中的内容其实就是各个参数的变量值。


<meta http-equiv="Refresh" content="2;URL=https://www.oldboy.com"> //(注意后面的引号，分别在秒数的前面和网址的后面)

<meta http-equiv="content-Type" charset=UTF8">

<meta http-equiv = "X-UA-Compatible" content = "IE=EmulateIE7" /> 
 

3.<body>内常用标签  主体

　　　　<hn>: n 的取值范围是1-6 ; 从大到小。用来表示标题

　　　　<p> : 段落标签。包裹的内容被换行。并且也上下内容之间有一行空白

　　　　<b> <strong> :加粗标签

　　　　<em>: 文字变成斜体

　　　　<sup> 和 <sub> ：上角标 和 下角标

　　　　<br> : 换行

　　　　<hr> : 水平线

　　　　特殊字符：&lt; &gt; &quot; &copy; &reg;

a

　　　　　　　　　　

4.<div>和<span>

　　　<div></div> 只是一个块级元素，并无实际意义 主要通过CSS 样式为其赋予不同的表现

　　　　　　块级标签（block）有：h系列  div  p  br  hr   table   tr

　　　<span></span> 为内联行（行内元素），同上。

　　　　　　内敛标签（inline）有：b   strong   strike   em  sup   sub   img   a   span    td   th

5.<img> 属性

　　　　src: 要显示图片的路径

　　　　alt: 图片没有加载成功时的提示

　　　　title : 鼠标悬浮时的提示信息

　　　　width : 图片的宽

　　　　height ：图片的高

列表标签

　　无序列表<ul> :[type属性：disc(实心圆点)(默认). circle(空心圆圈).square(实心方块)]　　　　

<ul>

  <li>咖啡</li>

  <li>茶</li>

  <li>牛奶</li>

</ul>
<ol>

  <li>咖啡</li>

  <li>牛奶</li>

  <li>茶</li>

</ol>

<ol start="">

  <li>咖啡</li>

  <li>牛奶</li>

  <li>茶</li>

</ol>

　　有序列表<ol>

　　<li> :列表中的每一项

　　<dl> :定义列表

　　<dt> : 列表标题

　　<dd> : 列表项

<dl>

   <dt>计算机</dt>

   <dd>用来计算的仪器 ... ...</dd>

   <dt>显示器</dt>

   <dd>以视觉方式显示信息的装置 ... ...</dd>

</dl>

 

表格标签

<table>

         <tr>

                <td>标题</td>

                <td>标题</td>

         </tr>

         <tr>

                <td>内容</td>

                <td>内容</td>

         </tr>

</table>

　<tr> :table row

　<th> :table head cell

　<td>: table data cell

　　border :表格边框

　　cellpadding : 内边距

　　cellspacing: 外边距

　　width :像素百分比。

　　rowspan :单元格竖跨多少行

　　colspan : 单元格横跨多少列（即合并单元格）　　

---恢复内容结束---

前端基础之 html的更多相关文章

  1. web前端基础知识及快速入门指南

    web前端基础知识及快速入门指南 做前端开发有几个月了,虽然说是几个月,但是中间断断续续的上课.考试以及其它杂七杂八的事情,到现在居然一直感觉自己虽然很多前端的知识很眼熟,却也感觉自己貌似也知识在门口 ...

  2. html css 前端基础 学习方法及经验分享

    前言: 入园第一天,想分享一点儿前端基础html css 的学习方法和一些经验给热爱前端,但是不知道从哪儿开始,依旧有些迷茫的新手朋友们.当然,适合每个人的学习方式不同,以下所讲的仅供参考. 一.关于 ...

  3. HTML+DIV+CSS+JSweb前端基础

    HTML+DIV+CSS+JSweb前端基础 1.<html>和</html> 标签限定了文档的开始和结束点. 属性: (1)  dir: 文本的显示方向,默认是从左向右 (2 ...

  4. 前端基础面试题(JS部分)

    1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined.Null.Boolean.Number.String 值类型:数值.布尔值.null.und ...

  5. 前端基础之DOM和BOM

    前端基础之DOM和BOM JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏 ...

  6. tableview前端基础设计（初级版）

    tableView前端基础设计 实现的最终效果 操作目的:熟悉纯代码编辑TableView和常用的相关控件SearchBar.NavigationBar.TabBar等,以及布局和基本功能的实现. 一 ...

  7. web前端基础学习路线

    1.HTML和CSS的基础知识,完成网页的初步设计 2.JavaScript基础知识和DOM.BOM的学习 3.前端基础框架:CSS框架Bootstrap.JavaScript框架jquery的熟悉使 ...

  8. JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}

    前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...

  9. 前端基础进阶（五）：全方位解读this

    https://segmentfault.com/a/1190000012646488  https://yangbo5207.github.io/wutongluo/ 说明:此处只是记录阅读前端基础 ...

  10. 前端基础之BOM和DOM day52

    前端基础之BOM和DOM   前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互 ...

随机推荐

  1. WEBLOGIC because another WebLogic Server instance is already using this directory

    错误提示:because another WebLogic Server instance is already using this directory 原因:ldap目录数据库文件被锁定,可能是w ...

  2. 解题（DirGraCheckPath--有向图的遍历（深度搜索））

    题目描述 对于一个有向图,请实现一个算法,找出两点之间是否存在一条路径. 给定图中的两个结点的指针DirectedGraphNode* a, DirectedGraphNode* b(请不要在意数据类 ...

  3. JAVA8 Stream集合操作：中间方法和完结方法

    StreamLambda为java8带了闭包,这一特性在集合操作中尤为重要:java8中支持对集合对象的stream进行函数式操作,此外,stream api也被集成进了collection api, ...

  4. Docker registry垃圾回收

    Docker registry垃圾回收 通过: docker run -p 5000:5000 -v /netdata/xxxx/registry:/var/lib/registry registry ...

  5. linux应用之test命令详细解析

    test命令用法. 功能:检查文件和比较值 1)判断表达式 if test  (表达式为真) if test !表达式为假 test 表达式1 –a 表达式2                  两个表 ...

  6. leetcode 动态规划类型题

    1,Triangle int mininumTotal(vector<vector<int>>& triangle) { ; i >= ; --i) { ; j ...

  7. Java8-函数式接口理解及测试

    1.  函数式接口的理解 根据重构的思想,需要把容易变化的模块进行抽象并封装起来,从这个点来看,Java8新引入的函数式接口就是基于这个思想进行设计的. 2. 函数式接口定义 2.1 自定义如下 需要 ...

  8. Ansible安装及OS规划

    Ansible安装  1.以管理用户mtnsadmin连接服务器后下载安装包(-O表示将下载的文件存放到指定的文件夹下,同时重命名下载的文件)     sudo wget -O /etc/yum.re ...

  9. centos服务器监控 服务器虚拟机里面的客户端zabbix-agent安装

    开启zabbix要用的端口, 也可以关闭服务器的防火 [html] view plain copy #vim /etc/sysconfig/iptables -A INPUT -m state --s ...

  10. Unity - Photon PUN 本地与网络同步的逻辑分离 （一）

    服务器大家可以使用Photon官网提供的,这样会变得很简单,直接搭建下就好.或者下载到本地开启本地端Photon服务器 (大家也可以使用和我一样方式有时间做了个winform 程序用来管理本地服务器开 ...