web前端学习的笔记.docx

01_HTMLBASICDay01第一个html文档赵旭zhaoxu@WEB 前端WEB-网页1、要求1、打字速度2、复习和预习工作3、英文4、练2、课程体系1、阶段一 - 基础1、HTML5Basic2、CSS3Basic3、PROJECT1-京东首页4、CSS3Core(核心)5、PROJECT2-京东详情页6、JAVASCRIPTBASIC2、阶段二 - JS1、JAVASCRIPTCORE2、jQuery3、阶段三1、服务器端2、HTML5CORE3、AJAX4、Bootstrap4、阶段四1、AngularJS2、React3、IOnic===========================================1、WEB基础知识1、web 与 Internet1、InternetInternet是一个全球性的计算机互联网络 ，中文名因特网,网Internet 提供的服务：Telnet,Email,WWW,BBS,FTP基本实现技术：1、分组交换原理2、TCP/IP协议簇2、Web Web 是运行在 Internet 上的一种应用(网页应用)Web 所谓的WWWWeb的规范是由W3C负责定制和推广W3C : World Wide Web Consortium(万维网联盟)Web能够将服务和信息关联到一起服务：Email,BBS,...信息：文字，图片，音视频，文件等3、Web的工作原理基于 B/S 结构模式的程序B : Browser(浏览器)S : Server(服务器)C/S : C : Client(客户端)S : Server由Web服务器，浏览器，通信协议 三部分组成Web服务器：允许为其他用户提供服务的机器通信协议：web 采用的是 http 协议HTTP : Hyper Text Transfer Protocol超文本传输协议规范了数据是如何打包以及如何传递的。4、Web服务器1、主要功能1、存储信息2、响应浏览器的请求，执行服务器端程序3、具备基本的安全功能2、主要Web服务器产品1、TOMCAT2、IIS3、APACHE3、服务器端相关技术1、php2、JSP(Java Server Page)3、ASP4、ASP.NET以上技术都具备访问数据库的能力5、浏览器1、主要功能1、代理用户 提交请求(User Agent,UA)2、作为HTML/CSS/JS解释器3、以图形化方式显示页面2、主流的浏览器产品1、Microsoft IE2、Mozilla Firefox3、Google Chrome4、Apple Safari5、Opera3、客户端技术运行于浏览器1、HTML2、CSS3、JavaScript(JS)2、HTML快速入门(重点)1、超文本Web 是一个超文本文件的集合2、什么是HTMLHTML：Hyper Text Markup Language(超文本标签语言)超文本：具备一些特殊功能的文本a : 英文字符的第一个超文本 a : 在页面中具备超链接作用b : 英文字符的第二个超文本 b : 在页面中会加粗显示文本标签：超文本的组成形式超文本 a:a/a超文本 b:b/b语言：具备一定的语法结构用HTML编写的网页文件，以.htm或.html作为文件的后缀(超文本文件)运行环境：任何一款浏览器开发工具：任意一款文本编辑工具都可以3、HTML基础语法1、标记语法在html中，用于描述功能的符号，称为标记p,a,b标记在使用时，必须用括起来标记分为1、封闭类型的标记也成为双标记，标记必须成对出现语法：标记内容/标记如果一对双标记中没有结束标记的话，网页中会产生意想不到的效果ex:a百度/ab加粗显示/bp段落文本/p2、非封闭类型的标记也称为单标记或空标记语法：标记或标记/ex:br : 换行img: 图片2、元素元素即标记a百度/a1、元素的嵌套HTML中通过嵌套的元素来形成更为复杂的页面结构注意：1、嵌套顺序pa/a/p 正确pa/p/a 错误2、格式问题被嵌套的东西要用 缩进来表示(Tab)ex:pba/a/b/pp控制的内容/pp控制的内容。。。。b加粗的文本/b/p2、属性 和 值属性：是用来修饰元素的。ex：想控制 p 标记里文本的 水平排列方式 为 右对齐语法：1、属性的声明必须位于开始标记里2、属性与标记之间要用一个空格隔开3、一个元素允许有多个属性，多属性之间用 空格 隔开， 并且排名不分先后4、属性 和 值之间用 = 连接ex:文本水平排列方式：align取值：left/center/rightp align=right id=p1这是一段文本/p设置 id 属性值为 p1标准属性：html中所有元素都具备的属性称之为标准属性1、id ：元素在页面中的独一无二