前端基础之 html
---恢复内容开始---
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> : 水平线
特殊字符:< > " © ®
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的更多相关文章
- web前端基础知识及快速入门指南
web前端基础知识及快速入门指南 做前端开发有几个月了,虽然说是几个月,但是中间断断续续的上课.考试以及其它杂七杂八的事情,到现在居然一直感觉自己虽然很多前端的知识很眼熟,却也感觉自己貌似也知识在门口 ...
- html css 前端基础 学习方法及经验分享
前言: 入园第一天,想分享一点儿前端基础html css 的学习方法和一些经验给热爱前端,但是不知道从哪儿开始,依旧有些迷茫的新手朋友们.当然,适合每个人的学习方式不同,以下所讲的仅供参考. 一.关于 ...
- HTML+DIV+CSS+JSweb前端基础
HTML+DIV+CSS+JSweb前端基础 1.<html>和</html> 标签限定了文档的开始和结束点. 属性: (1) dir: 文本的显示方向,默认是从左向右 (2 ...
- 前端基础面试题(JS部分)
1.几种基本数据类型?复杂数据类型?值类型和引用数据类型?堆栈数据结构? 基本数据类型:Undefined.Null.Boolean.Number.String 值类型:数值.布尔值.null.und ...
- 前端基础之DOM和BOM
前端基础之DOM和BOM JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏 ...
- tableview前端基础设计(初级版)
tableView前端基础设计 实现的最终效果 操作目的:熟悉纯代码编辑TableView和常用的相关控件SearchBar.NavigationBar.TabBar等,以及布局和基本功能的实现. 一 ...
- web前端基础学习路线
1.HTML和CSS的基础知识,完成网页的初步设计 2.JavaScript基础知识和DOM.BOM的学习 3.前端基础框架:CSS框架Bootstrap.JavaScript框架jquery的熟悉使 ...
- JS BOM DOM对象 select联动 计时器 时间 css操作 节点(标签 ) 查找标签 {前端基础之BOM和DOM}
前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我 ...
- 前端基础进阶(五):全方位解读this
https://segmentfault.com/a/1190000012646488 https://yangbo5207.github.io/wutongluo/ 说明:此处只是记录阅读前端基础 ...
- 前端基础之BOM和DOM day52
前端基础之BOM和DOM 前戏 到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互 ...
随机推荐
- HC-05蓝牙模块配对步骤
参考:https://blog.csdn.net/m0_37182543/article/details/76383247
- Java Web解决跨域请求
要知道跨域请求就要先了解同源策略,那么什么是同源?什么是不同源?简单来说就是,如果两个资源,包括HTML页面.JavaScript脚本.css样式,对应的协议.域名和端口完全相同,那么这两个资源就是同 ...
- 【mybatis】使用mybatis框架中踩过的坑
好久没来记录一下自己的学习情况,最近都在学框架,今天来记录一下关于mybatis框架的学习过程中碰过的一些问题: 以下内容可能稍微有点凌乱,因为是把之前遇到过的错误或异常都集中一起了,不过我已经把问题 ...
- C# 自制报表组件 EzReportBuild 2.0
组件无闪烁.画面流畅,效率一般,支持SQL和ACCESS两种.可以完成报表设计.预览.打印等功能,提供接口函数,可以将设计.预览等嵌入到自定的winform中调用,使用简单.每份报表可设置多页,每页可 ...
- Hadoop2.7.7_HA高可用部署
1. Hadoop的HA机制 前言:正式引入HA机制是从hadoop2.0开始,之前的版本中没有HA机制 1.1. HA的运作机制 (1)hadoop-HA集群运作机制介绍 所谓HA,即高可用(7*2 ...
- About Feature Scaling and Normalization
在进行数据处理之前,一定要想一想,你的算法是用来做什么,这样才能选择如何对数据进行预处理. 参考网站: http://sebastianraschka.com/Articles/2014_about_ ...
- 平板电脑与火狐浏览器下载excel中文文件名乱码
fileName = new String(fileName.getBytes("utf-8"), "iso8859-1");//兼容火狐.ie.平板 resp ...
- java代码实现简单的认证——图片验证码形式
前言:认证在互联网中会经常见到,其主要作用是安全问题中防止恶意破解.刷票等.在系统开发中认证的实现也有很多种,什么手机短信认证,邮箱认证等.在这里我使用最基本的验证码的形式进行认证,下面例出过程. 验 ...
- OO_多项式求导_单元总结
概述: 面向对象第一单元的作业是三次难度依次递增的多项式求导.第一次作业是仅包含带符号整数和幂函数的多项式求导,例如:-1+xˆ233-xˆ06:第二次是在前面的基础上增加了三角函数的求导,例如:-1 ...
- xx星空面试题
一面 1.什么是多态 实现原理? 2.什么是重载?class加载原理? 3.常用设计模式,简单介绍 4.看过哪些java的书?android的书? 5.动态注册静态注册 优缺点?静态注册函数如何被调用 ...