Python全栈 Web(概述、HTML基础语法)-阿里云开发者社区

开发者社区> 巴黎香榭> 正文

Python全栈 Web(概述、HTML基础语法)

简介:
+关注继续查看
Web:
什么是Web?
Web就是网页  是一种基于B/S的应用程序
                Web应用程序是由多个Servlet、JSP页面、HTML文件以及图像文件等组成
B:Browser   浏览器
S:Server    服务器
——————————————————
C/S
C:client  客户端
S:Server 服务器
Web组成:
浏览器:代替用户向服务器发送请求
服务器:接受用户响应
通信协议:规范数据在网络中是如何打包即传递的
HTTP:HyoerText transfer portocal
      超文本传输协议
Web服务器:
作用;
接受用户请求并且响应
存储Web信息
具备安全性
产品:
Apache
Tomcat
IIS  -Internet Information Server
Nginx
....
技术:
JSP - Java  Server page
PHP
ASP.net
Python Web (Django、Flask..)
Web浏览器:
作用:
代替用户向服务器发送请求
作为响应用户的解释引擎,向用户呈现界面
主流产品:
根据浏览器内核/引擎划分
Microsoft  IE
Google    Chrome
Mozilla    FireFox
Apple      Safari
Opera      Opera
浏览器引擎:
渲染引擎 - 解析 HRML、CSS  控制页面渲染效果
JS引擎 - 解释网页脚本文件
前段开发技术:
HTML  CSS  JavaScript

HTML:

HTML概述:
什么是HTML?
HyperText Markup language
超文本标记语言
作用:
书写网页结构
超文本:
具备特殊功能的文本 例如超链接

标记:
也叫标签 主要是用来标记网页中的内容
实现网页的布局和JS操作
HTML在技术算中的表现:
所有的网页文件在计算机中都是以.html、.htm文件储存的

开发工具:
记事本
Editplus、DreamWeaver
sublime、Webstorm、Hbuilder、VSCode、Atom
运行工具:
Chrome  浏览器
调试工具:
开发者工具  快捷键:F12

HTML基础语法:
标签/标记/元素:
在网页中具有特殊功能的符号
HTML所有的标签都以<>为标致区分
标签分类:
双标记:
成对出现  有开始有结束
语法:
<开始> 内容 </结束>
<h1> hello world </h1>
单标记:
只有开始没有结束 可以手动添加/表示结束
语法:
<标签名>
<标签名/>
<br> --- <br/>
<hr> --- <hr/>
标签的嵌套:
在双标记中出现其他的标记
超链接:
<a>首页</a>
文本加粗:
<b>首页</b>
加粗超链接:
<a>
<b>首页</b>
</a>

嵌套结构中 外层元素成为父元素 内层元素叫子元素

文档结构:
<html>
<head> </head>
<body>
hello world!
</body>
</html>
书写规范:
HTML不区分大小写
推荐用小写
保持适当的缩进 增强代码可读性
标签属性:
主要用来修饰标签的显示效果
语法:
属性由属性名和属性值组成:
属性名=“属性值”
属性的声明须写在开始标签中
<开始 属性名=“属性值”> ... </结束>
每个标签都可以设置多个属性, 属性之间使用空格隔开
HTML注释:
<!--
注释内容
-->
注意:
注释不能写在标签里  注释不能嵌套
HTMl的换行于空格:
HTML会忽略多余的 空只显示一个空格
如果需要多个空格或者<>
都需要使用特殊符号来代替

HTML结构组成:
文档类型声明:
<!doctype html> //H5的声明方式
作用:
告诉浏览器当前使用的HTML版本
以便浏览器能正确解析HTML的标签和渲染样式
书写位置:
文档的第一行代码
文档的开始和结束:
在文档类型声明之后使用 <html></html> 表示文档的开始和结束
在HTML标签中包含连个子元素
<head> </hesd>:
网页的头部信息 包含网页的标题,选项卡的图标
网页的关键字 作者 描述信息等 还可以引用外部的资源文件
子元素:
1.设置网页的标题:
<title> 我的第一个网页 </title>
2.设置字符编码:
<meta charset="utf-8">
浏览器按照utf-8编码格式解析网页
<body> </body>:
网页的主体信息 网页所呈现的内容
都要写在body里

文本相关的标签:
字符实体(具有特殊意义的符号
&nbsp; 表示一个空格
&lt;         表示小于号 <
&gt; 表示大于号 >
&copy; 表示版权符号 @
&yen; 表示人民币符号 ¥
文本样式标签:
斜体显示文本:
<i> </i>    斜体显示
<u> </u> 文本添加下划线
<b> </b> 文本加粗
<s> </s> 删除线
<sup> </sup>上标
<sub> </sub>下标
这些标签可以与其他的标签或文本共行显示
标题标签:
可以以不同的文字大小和加粗方式显示文本
语法:
<hn> </hn>  n:取值1~6
可以改变文字大小和自动加粗
每个标题都会具备垂直的空白距离
每个标题都独占一行 不与其他元素共行显示
每个标题都可以添加属性align
取值:
left   center  right
默认左对齐
段落标签:
突出显示一段文本 每一段的文本都独占一块/行
不与其他元素共行 并且具备垂直空白距离
语法:
<p> </p>
属性:
align  设置文本水平对齐方式
       left   center  right
格式标签:
<br> --- <br/> 换行标签
<hr> --- <hr/> 水平线
分区标签:
块分区:
<div> </div>
划分页面结构 配合CSS实现页面布局
独占一块/行显示
行内分区元素:
<span> </span>
设置同一行文本的不同样式(结合CSS)
可以与其他元素或文本共行显示
允许一行文本中使用span元素
标签分类:
块级元素:
只要是在网页中独占一行 不予其他元素共行显示
的元素都是块级元素
都可以来做布局
所有的块级元素都可以添加align属性设置内容的水平对齐方式 
行内元素:
可以与其他元素共行显示

列表标记:
按照重是上到下的方式排列数据
并且能够显示项目符号在数据前面
列表的组成:
列表的类型:
有序列表  <ol> </ol>(ordered list)
默认按照数字排列
无序列表  <ul> </ul> (unordered list)
默认以实心原点作为标识
列表项:
列表中的每一天数据都是一个列表项
语法:
<li> </li>
列表项需要嵌套在列表标签中使用
列表属性:
有序列表---ol
type属性:设置项目符号
1:按照数字排列(默认)
a:按照小写字母顺序排列
A:按照大小字母顺序排列
i:罗马数字排列(分大小写)
start属性:设置从第几个字符开始排列
只能取值数字
无序列表---ul
type属性:设置项目符号
disc:实心原点(默认)
circle:空心圆的
square:空心方框
none:不显示项目符号
列表嵌套:
在一个列表中又出现了其他的列表
图像与超链接:
URL(Uniform resource Locator)
统一资源定位符
用来表示网络中资源的位置 俗称路径
URL的组成:
协议、域名、主机名、文件
URL分类:
绝对路径:
从根目录开始查找
常用于网络文件路径
相对路径:
从当前所在的目录开始查找
根相对路径:
从Web程序所在的目录开始查找资源文件
URL中不能出现中文
URL严格区分大小写
图像标签:
在网页中插入一张图片
语法:
<img>
属性:
src:指定文件路径
width:设置宽度以像素为单位px
height:设置高度(px)
sorc必填 宽高可以省略
省略为图片默认大小
title:
用来设置图片的标题
当鼠标悬停在图片上方时显示
alt
用来设置显示文件加载失败提示

非常简单没什么东西.............




版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
阿里云轻量应用服务器基础建站系统部署Web环境与应用
阿里云轻量应用服务器基础建站系统部署Web环境与应用
574 0
HTML基础知识概括
1.html的概念 HTML是用来描述网页的一种语言. HTML指的是超文本标记语言(HyperText Markup Language) HTML不是一种编程语言,而是一种标记语言(markup language) 标记语言是一套标记标签 HTML使用标记标签来描述网页 2.
855 0
从头编写 asp.net core 2.0 web api 基础框架 (2)
原文:从头编写 asp.net core 2.0 web api 基础框架 (2) 上一篇是: http://www.cnblogs.com/cgzl/p/7637250.html Github源码地址是: https://github.
752 0
使用OpenApi弹性释放和设置云服务器ECS释放
云服务器ECS的一个重要特性就是按需创建资源。您可以在业务高峰期按需弹性的自定义规则进行资源创建,在完成业务计算的时候释放资源。本篇将提供几个Tips帮助您更加容易和自动化的完成云服务器的释放和弹性设置。
8268 0
JavaWeb初识 认识jsp,基础配置
Servlet是Java代码包裹Html代码 JSP是Html代码包裹Java代码JSP就是一个Java类 例如index.jsp 编译后的文件夹名称就是 index_jsp.java 所以说jsp就是一个Java类,并不是想Html一样是个超文本传输或者是其他什么的JSP就是一个Servlet,jsp继承与Servlet,Servlet有的JSP他都有 JSP的转化过程是>>jsp.
870 0
HTML基础
HTML基本标签     Html介绍 文件标签 排版标签 块标签 字体标签 清单标签 图形标签 链接标签 表格标签 HTML表单标签 Form标签 Input种类 Select与option标签 Textarea标签 HTML框架及特殊字符 框架标签 其它标签与特殊字符 Html介绍 1.      什么是html?     Html是用来描述网页的一种语言。
1088 0
走进JavaWeb技术世界1:JavaWeb的由来和基础知识
本系列文章将整理到我在GitHub上的《Java面试指南》仓库,更多精彩内容请到我的仓库里查看 https://github.com/h2pl/Java-Tutorial 喜欢的话麻烦点下Star哈 文章首发于我的个人博客: www.how2playlife.com 本文是微信公众号【Java技术江湖】的《走进JavaWeb技术世界》其中一篇,本文部分内容来源于网络,为了把本文主题讲得清晰透彻,也整合了很多我认为不错的技术博客内容,引用其中了一些比较好的博客文章,如有侵权,请联系作者。
1772 0
+关注
巴黎香榭
一个有梦想的咸鱼~~~
86
文章
1
问答
文章排行榜
最热
最新
相关电子书
更多
文娱运维技术
立即下载
《SaaS模式云原生数据仓库应用场景实践》
立即下载
《看见新力量:二》电子书
立即下载