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

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. java后端学习记录2019

    学习计划 2019年计划 1.学习计算机基础,并加以实践.包括LeetCode刷题.数据库原理(索引和锁.Sql优化等).网络协议(Http.Tcp).操作系统(加深Linux).<Http权威 ...

  2. mysql 多列索引学习-经典实例

    索引优化 ,b-tree假设某个表有一个联合索引(c1,c2,c3,c4) 以下 只能使用该联合索引的c1,c2,c3部分A. where c1 = x and c2 = x and c4>x ...

  3. thinkphp 响应对象

    <?php namespace app\admin\controller; use think\Request; class Index{ public function index(Reque ...

  4. python requests库网页爬取小实例：百度/360搜索关键词提交

    百度/360搜索关键词提交全代码: #百度/360搜索关键词提交import requestskeyword='Python'try: #百度关键字 # kv={'wd':keyword} #360关 ...

  5. ThinkPHP5 与ThinkPHP3.2公共函数放置位置

    最初使用ThinkPHP3..3的时候,我们自己定义的公共函数常常放置于 \Common\function.php 由于最近准备重新捡起微信开发,准备用ThinkPHP5进行微信公众号开发,使用到公共 ...

  6. window下mongodb的安装和环境搭建

    一.下载安装包或者压缩包 1.下载 mongodb官网社区版下载页面 开发者一般使用社区版即可 3.6.3版本仅支持64位版本 2.安装 mongo compass是一个图形界面管理工具,安装过程非常 ...

  7. Unable to resolve target 'android-XX' 类似的错误。

    解决办法: 打开项目代码中的Project target,将 复制代码 代码如下: # Project target.   target=android-7 修改为你当前支持的ADK版本即可. 参考: ...

  8. faster-rcnn 笔记

    2019-02-18,15点00 ''' 下面是别人写的原始的笔记,我在上面自己补充了一些. ''' #https://www.cnblogs.com/the-home-of-123/p/974796 ...

  9. 修改oracle的字符集操作方法

    cmd环境下进行以下命令行的操作--连接sqlplus / as sysdba--命令行shutdown immediate; startup mount ALTER SYSTEM ENABLE RE ...

  10. # 2019-2020-4 《Java 程序设计》结对项目总结

    2019-2020-4 <Java 程序设计>结对项目阶段总结---<四则运算--整数> 一.需求分析 实现一个命令行程序 要求: 自动生成小学四则运算题目(加,减,乘,除): ...