路飞学城Python-Day42

前端

01-前端介绍

web1.0时代的网页制作一般都是静态的网页页面

web1.0时代网页三剑客 Dreamweaver+Fireworks+Flash

什么是静态页面？

没有与用户进行交互的，而是仅仅是给读者或者用户去浏览的一个网页，称为“牛皮鲜”网页

web1.0时代用户只能浏览网页和图片

05年开始网页进入了2.0时代，仅仅是静态网页和图片已经不能满足用户的需求了，用户需求和体验都越来越高，动态页面使得用户不仅仅能浏览网页，还能对网页操作，和服务器进行交互

登录新浪微博输入的账号密码，可以传输给服务器，通过服务器进行后台的校验再返回给用户展示的页面，不仅仅包含动画、视频、音频，还能让用户进行交流，上传，下载等，所以前段现在更接近于后端的开发，所以这是一门前端开发的只是。

web1.0时代的静态网页代码相比现在的网站代码比较冗余，维护比较困难，所以后期就很难写

web前端能做什么？

公司官网、移动端网页、移动端APP、微信小程序

前端的核心内容有3个部分 HTML、CSS、JavaScript

网页最主要的有3个部分组成1.结构；2.表现；3.行为，现在的网页标准是W3C

1.html 超文本标记语言简单来说，网页就是用HTML语言制作的。HTML是一门描述性语言，是一门非常容易入门的语言

2.CSS 层叠样式表以后我们在别的地方看到“层叠样式表”、“CSS样式”，指的就是CSS

3.JavaScript JavaScript是一门脚本语言

4.HTML是网页的结构，CSS是网页的外观，而JavaScript是页面的行为

02-HTML介绍

HTML简介

HTML是一个网页的主题部分，也是网页的基础，因为一个网页可以没有样式，可以没有交互，都是必须有网页呈现的内容

所以HTML部分是整个前端的基础

HTML，全称是超文本标记语言（HyperText Markup Language），它是一种用于创建网页的标记语言。标记语言是一种将文本（Text）以及文本相关的其他信息结合起来，展现出关于文档结构和数据处理细节的计算机文字编码。与文本相关的其他信息（包括例如文本的结构和表示信息等）与原来的文本结合在一起，但是使用标记（markup）进行标识

1.什么是标记语言？

标记语言既描述了文档本身的信息（问题内容和回答的情况），也描述了文档的结构和各部分的作用。而HTML则是世界通用的、用于描述一个网页的信息的标记语言，我们使用的浏览器具有将HTML文档渲染并展示给用户的功能（当你访问知乎网站的时候，实际上你获得了一份由知乎提供给你的HTML文档。浏览器将根据HTML文档渲染出你看到的网页）

HTML文本中，带尖括号的叫标签，标签描述了文本的作用，比如p标签表示其内部的文本是一个段落，a标签标识内部的文本是超链接等；与此同时，通过标签的互相嵌套，表示了这个文档的结构。至于哪个标签表示什么意思、总共有多少个种类的标签这类的问题，由W3C(万维网联盟)这一组织规定。很显然，HTML作为一种标记语言它并没有什么逻辑，简单来说就是一些符号，一些有特殊意义的符号，一些浏览器认识的有特殊意义的符号

2.HTML开发环境

常见的Hbuild、Sublime Text、Dreamweare都可以用来开发HTML

3.文件的后缀名规范

为了统一HTML语言，建议所有的网页相关的都采用.HTML来作为后缀( html与htm后缀网页后缀可以互换，对网页完全没有影响同时也没有区别。可以认为html与htm没有本质区别，唯一区别即多与少一个“l”)

标签之间都是互相嵌套的，也就是父子级关系，一个网页是由一个结构表示的，结构是由标签的互相嵌套组成的

4.什么是标签？

1. 在HTML中规定标签使用英文的的尖括号即`<`和`>`包起来，如`<html>`、`<p>`都是标签。

2. HTML中标签**通常**都是成对出现的，分为开始标签和结束标签，结束标签比开始标签多了一个`/`，

如`<p>标签内容</p>`和`<div>标签内容</div>`。开始标签和结束标签之间的就是标签的内容。

3. 标签之间是可以嵌套的。例如：div标签里面嵌套p标签的话，那么`</p>`必须放在`</div>`的前面。

4. HTML标签不区分大小写，`<h1>`和`<H1>`是一样的，但是我们通常建议使用小写，因为大部分程序员都以小写为准。

注意：不是所有的标签都需要互相嵌套

03-HTML文档结构

一个HTML文档就是一个文件。HTML文档是有自己的文件结构的

<!DOCTYPE HTML> --->这个不是标签，只是对html的一个声明

<html> -->文档的根节点

<head>...</head> -->子节点，缩进代表的是一块区域

</html>

首先，<!DOCTYPE HTML>是文档声明，必须写在HTML文档的第一行，位于<html>标签之前，表明该文档是HTML5文档。

<html></html> 称为根标签，所有的网页标签都在<html></html>中。
<head></head> 标签用于定义文档的头部，它是所有头部元素的容器。
常见的头部元素有<title>、<script>、<style>、<link>和<meta>等标签，头部标签在下一节中会有详细介绍。
在<body>和</body>标签之间的内容是网页的主要内容，如<h1>、<p>、<a>、<img>等网页内容标签，在<body>标签中的内容（图中淡绿色部分内容）最终会在浏览器中显示出来。

HTML文档包含了HTML标签及文本内容，不同的标签在浏览器上会显示出不同的效果，所以我们需要记住最常见的标签的特性。

转载于:https://www.cnblogs.com/pandaboy1123/p/9458443.html

路飞学城Python-Day42相关推荐

路飞学城python全栈开发_[Python] 老男孩路飞学城Python全栈开发重点班骑士计划最新100G...
简介老男孩&路飞学城Python全栈开发重点班课程,作为Python全栈教学系列的重头戏,投入了全新的课程研发和教学精力,也是Python骑士计划的核心教学,由ALEX老师开班镇守,一线技术 ...
路飞学城—Python爬虫实战密训班第三章
路飞学城-Python爬虫实战密训班第三章一.scrapy-redis插件实现简单分布式爬虫 scrapy-redis插件用于将scrapy和redis结合实现简单分布式爬虫:- 定义调度器- 定 ...
b站路飞学城python课梨视频项目代码
@b站路飞学城python课梨视频项目代码 # -*- coding:utf-8 -*- import requests from lxml import etree import random im ...
路飞学城python开发入门学习
零基础参加了路飞学城python七天入门集训,由于无相关基础知识,所以笔记简陋,大家将就着看看,欢迎批评指正. 1.第一个程序: print('Hello,World") 2. python ...
路飞学城python电子书_路飞学城-Python开发集训-第一章
路飞学城-Python开发集训-第一章 1.本章学习心得.体会我: 间接性勤奋. 我: 学习方法论:输入--输出---纠正我: 对对对走出舒适区, 换圈子, 转思路,投资自我加筹码. 我: 圈子 ...
路飞学城python全栈开发_python 全栈开发，Day98(路飞学城背景,django ContentType组件,表结构讲解)...
昨日内容回顾 1. 为什么要做前后端分离?-前后端交给不同的人来编写,职责划分明确.-API (IOS,安卓,PC,微信小程序...)-vue.js等框架编写前端时,会比之前写jQuery更简单快捷. ...
路飞学城-python爬虫密训-第三章
(一)学习心得其实在没有正式学习python编程语言中,就知道模块是python最重要部分之一.虽然在前面HTTP协议跟IO多路复用都没有接触学的也是一知半解,scrapy模块比resquests模 ...
路飞学城-Python爬虫实战密训-第1章
正式的开始学习爬虫知识,Python是一门接触就会爱上的语言.路飞的课真的很棒,课程讲解不是告诉你结论,而是在告诉你思考的方法和过程. 第一章,学习了如何爬取汽车之家以及抽屉登录并点赞. 1 impo ...
路飞学城-Python 爬虫实战密训-第 1 章
本节学习体会: 鸡汤心得: 1.时代发展太快,要不断学习新东西,武装自己,才能跟得上时代的潮流,不然就是面临被pass的命运 2.要看清楚趋势,不要闭门造车 3.学习编程语言就跟学英语一样,方法很重要 ...
路飞学城-Python爬虫集训-第一章
自学Python的时候看了不少老男孩的视频,一直欠老男孩一个会员,现在99元爬虫集训果断参与. 非常喜欢Alex和武Sir的课,技术能力超强,当然讲着讲着就开起车来也说明他俩开车的技术也超级强! 以上 ...

路飞学城Python-Day42

路飞学城Python-Day42相关推荐

最新文章

热门文章