没有合适的资源？快使用搜索试试~ 我知道了~

文库首页前端JavascriptHTML5基础教程PDF版

HTML5基础教程PDF版

html5

需积分: 0 9 下载量 133 浏览量 2023-07-22 22:50:24 上传评论收藏 8.06MB PDF 举报

温馨提示

试读

69页

HTML5基础教程PDF版可以通过链接直接访问：http://doubibiji.com/#/html5/HTML5 如果有帮助，麻烦给个好评！！！

资源推荐

资源详情

资源评论

本课程基于尚硅⾕李⽴超⽼师的 Web前端零基础⼊⻔HTML5+CSS3基础教程，李⽴超⽼师讲的是真的好。

1 前端简介

现在我们来学习HTML5的课程，HTML是做什么的呢，我还是哔哔两句吧。

1.1 软件架构分类

我们平时开发的软件主要有两种： C/S架构和 B/S架构

1 什么是C/S架构

C/S架构全称为Client/Server，也就是客户端/服务器架构。

⽤户需要下载客户端的软件，例如QQ，微信，还有⼿机⾥的各种App 等软件，都需要下载软件进⾏安装，我们下

载安装的就是客户端。通过使⽤客户端和服务器进⾏连接交互。

2 什么是B/S架构

B/S架构全称为Browser/Server，也就是浏览器/服务器架构。

Browser指的就是浏览器，⽤户打开浏览器就能访问⽹⻚，不需要下载客户端，例如访问京东、淘宝等⽹站。

通过浏览器请求服务器，服务器返回⽹⻚的内容。

其实B/S架构也是基于C/S架构的，因为浏览器也是⼀个客户端嘛。

3 B/S 架构的优点

相较于C/S架构系统，B/S 架构的⽹⻚有如下⼀些优点：

不需要安装客户端，打开浏览器就能访问；

⽆需更新，⽹⻚如果有更新，我们重新访问⽹⻚就是最新的版本；

跨平台，在任何操作系统，使⽤浏览器都可以访问。

所以 CSS 就是⽤来开发⽹⻚的，那么 CSS 起到什么作⽤呢？且听我继续哔哔。

1.2 浏览器和⽹⻚

1 浏览器的作⽤

通过浏览器我们只需要⼀个⽹址便可以访问任何的⽹站，但是我们从服务器获取到的内容并不是我们看到的⽹⻚的

样⼦。

例如，我们通过 www.jd.com 访问京东⽹站，看到的如下的内容：

但其实服务器给我们返回的内容并不是看到的样⼦，我们在⽹⻚上，通过右键 --> 查看⽹⻚源代码，可以看到⽹⻚

原本的样⼦（内容太多了，这⾥简单粘贴了⼀点）：

<!DOCTYPE html>

<html>

<head>

! !<meta charset="utf8" version='1'/>

! !<title>京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！</title>

! !<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-

scale=1.0, user-scalable=yes"/>

! !<meta name="description"

! ! ! ! !content="京东JD.COM-专业的综合⽹上购物商城，为您提供正品低价的购物选择、优质便捷的服务体

验。商品来⾃全球数⼗万品牌商家，囊括家电、⼿机、电脑、服装、居家、⺟婴、美妆、个护、⻝品、⽣鲜等丰富品

类，满⾜各种购物需求。"/>

! !<meta name="Keywords" content="⽹上购物,⽹上商城,家电,⼿机,电脑,服装,居家,⺟婴,美妆,个护,⻝

品,⽣鲜,京东"/>

! !<script type="text/javascript">

! ! ! !window.point = {}

! ! ! !window.point.start = new Date().getTime()

! !</script>

! !<link rel="icon" href="//www.jd.com/favicon.ico"

mce_href="//www.jd.com/favicon.ico" type="image/x-icon"/>

! !<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

! !<meta name="renderer" content="webkit"/>

</head>

! !

! !<div id="J_accessibility"></div>

! !

! !<div id="J_promotional-top">

! !</div>

! !<div id="shortcut">

! ! ! !<div class="w">

! ! ! ! ! !<ul class="fl" clstag="h|keycount|head|topbar_01">

! ! ! ! ! ! ! !<li class="dropdown" id="ttbar-mycity"></li>

! ! ! ! ! !</ul>

! ! ! ! ! !<ul class="fr">

! ! ! ! ! ! ! !<li class="fore1 dropdown" id="ttbar-login"

clstag="h|keycount|head|topbar_02">

<a href="//passport.jd.com/uc/login?ReturnUrl=https%3A%2F%2Fwww.jd.com%2F"

class="link-login">你好，请登录</a>  <a

href="//reg.jd.com/reg/person?ReturnUrl=https%3A//www.jd.com/" class="link-

regist style-red">免费注册</a>

! ! ! ! ! ! ! !</li>

! ! ! ! ! ! ! !<li class="spacer"></li>

! ! ! ! ! ! ! !<li class="fore2" clstag="h|keycount|head|topbar_03">

! ! ! ! ! ! ! ! ! !<div class="dt"><a target="_blank"

href="//order.jd.com/center/list.action">我的订单</a></div>

! ! ! ! ! ! ! !</li>

! ! ! ! ! ! ! !<li class="spacer"></li>

! ! ! ! ! ! ! !<li class="fore3 dropdown" id="ttbar-myjd"

clstag="h|keycount|head|topbar_04">

! ! ! ! ! ! ! ! ! !<div class="dt cw-icon"><a target="_blank" href="//home.jd.com/">我

的京东</a><i class="iconfont"></i><i

! ! ! ! ! ! ! ! ! ! ! ! ! !class="ci-right"><s>◇</s></i></div>

! ! ! ! ! ! ! ! ! !<div class="dd dropdown-layer"></div>

! ! ! ! ! ! ! !</li>

! ! ! ! ! !</ul>

! ! ! !</div>

! !</div>

! ...内容太多了，意思意思

</body>

</html>

服务器返回的上⾯的内容，是怎么变成看到的⽹⻚的样⼦呢？

这就是浏览器的作⽤，浏览器将服务器返回的源代码渲染成看到的⽹⻚。

2 浏览器的问题

⽬前市⾯上存在有很多不同的浏览器，例如IE、Chrome、Firefox、Safari、Opera⼀⼤堆。

在万维⽹的初期，⽹⻚编写并没有标准。于是同⼀个⽹⻚被不同的浏览器渲可能染成不同的效果，就像下⾯这样：

那怎么办呢？

那就制定标准呗。

3 W3C 的建⽴

伯纳斯·李（万维⽹和第⼀个⽹⻚的发明⼈） 1994 年建⽴万维⽹联盟（W3C）

W3C 的出现为了制订⽹⻚开发的标准，以使同⼀个⽹⻚在不同的浏览器中有相同的效果。

所以，我们需要制订我们编写的⽹⻚都需要遵循 W3C 的规范！

4 ⽹⻚的结构思想

根据 W3C 标准，⼀个⽹⻚主要由三部分组成：结构、表现还有⾏为。

结构

结构（⻣架）：HTML ⽤于描述⻚⾯的结构

表现

表现（⽪肤）：CSS ⽤于控制⻚⾯中元素的样式

⾏为

⾏为（交互）：JavaScript ⽤于响应⽤户操作

剩余68页未读，继续阅读

评论收藏

内容反馈

资源评论

资源反馈

评论星级较低，若资源使用遇到问题可联系上传者，3个工作日内问题未解决可申请退款~

山石岐渡

粉丝: 739
资源: 12

上传资源快速赚钱

我的内容管理展开

我的资源快来上传第一个资源

我的收益

登录查看自己的收益

我的积分登录查看自己的积分

我的C币登录后查看C币余额

我的收藏

我的下载

下载帮助

前往需求广场，查看用户热搜

HTML5基础教程PDF版

HTML 5 教程.pdf

html5-pdf教程

HTML5教程(pdf清晰版)

HTML_教程.pdf

HTML教程(完整版).pdf

HTML 5 Canvas基础教程 源码+PDF

HTML5与CSS3基础教程 第八版 中文版 高清 PDF

HTML5 教程 PDF版本下载.txt

《HTML5从入门到精通》中文学习教程.pdf

html5实战pdf

HTML5与CSS3基础教程（中文第8版）.pdf

[HTML5] HTML5 基础教程 英文版

HTML5与CSS3基础教程 第8版 中文高清完整.pdf版

HTML5与CSS3基础教程(第八版).pdf _非完整

Html_Js_cssWeb基础教程.pdf

【好】 HTML_系列教程.pdf

HTML 语言教程电子书

HTML教程资源

HTML与CSS入门经典 第8版 pdf

HTML5教程pdf格式

html5+教程

HTML5系列教程

CSS+HTML教程(完整版).zip

HTML语言基础教程.pdf

HTML5入门教程.pdf

HTML教程（PDF格式）

HTML5+CSS3网站设计基础教程（第2版）_源代码.zip

最新资源

HTML 5 Canvas基础教程源码+PDF

HTML5与CSS3基础教程第八版中文版高清 PDF

[HTML5] HTML5 基础教程英文版

HTML5与CSS3基础教程第8版中文高清完整.pdf版

HTML与CSS入门经典第8版 pdf