前端DAY01-HTML

  • 前端DAY01-HTML已关闭评论
  • 173 次浏览
  • A+
所属分类:Web前端

DAY01

计算机的介绍
特点: 	1.可以进行数值计算,可以进行逻辑计算 	2.具有存储记忆功能 硬件:看得见,摸得着的 显示器,主机,存储器 软件:看得见,摸不着的 	系统软件:操作系统:windows、Linux、UNIX等 	应用软件:各类app 
C/S架构和B/S架构
1.C/S架构:需要安装 app 	C:client 客户机 由服务器S提供的信息 	S:server 服务器 (数据来源) 	优点:安全性更高 	缺点:对用户来说需要安装更新维护 2.B/S架构:不需要安装 网页 	B:browser 浏览器由服务器S提供的信息 	S:server 服务器 (数据来源) 	优点:对用户友好,对设备要求低,不必安装维护 	缺点:安全性低 
网站的建设流程
一、注册域名(网址):www.baidu.com 二、租用服务器:一台电脑用来存储数据 三、网站制作: 	以前的流程: 		1.产品经理提需求 		2.UI根据需求设计网页 		3.前端把UI设计的网页以代码的形式运行到浏览器 		4.后台:数据处理,功能的实现 		5.测试:测试问题 		6.上线 	现在的流程:(前后端分离) 		1.产品经理提需求 		2.UI和前端及后台同时工作 		3.联调 		4.测试:测试问题 		5.上线 四、推广:1.免费推广:从代码上进行一些处理 		2.付费推广:广告,视频(抖音,b站...) 百度推广... 五、维护 
前端和后台:
前端:客户端,离用户比较近,所做的工作是用户看得到的 后台:服务端,所做的工作是用户并不能直接看到的 前端和后台的关系: 	前端发出请求给服务器,后台根据前端发出的请求进行响应,把结果反馈给前端,显示在前端界面上 
Web网站和网页
web:全称 world wide web;万维网、广域网、互联网 网站:是无数个网页的集合 网页的组成: 	网页的结构html:超链接、音频、视频、图片、文本...搭建的网页结构; 	网页的表现css:修饰结构,让结构更好看; 	网页的行为javascript:实现和网页的交互效果; 
浏览器的介绍
网页需要在浏览器中运行 浏览器的兼容:浏览器解析代码的结果不一样的情况,兼容主流浏览器; 主流浏览器:IE、firefox、Safari、Chrome、opera、edge 内核:(四大浏览器内核) 	Trident  不能跨平台	IE 	Gecko  开源	firefox 	webkit 轻量级	(Safari 、苹果浏览器、谷歌浏览器(旧版)) 	webkit–>blink 	(由webkit衍生而来的) (谷歌、opera) 	Presto(Opera前内核) (已废弃)	(opera) 
Web标准
代码需要标准化 Web标准: 	结构:html5 	表现:css 	行为:js 	结构和表现的语言标准是由W3C制定的 	行为标准是由ECMA制定的 html+css 	xhtml(html4.01)+css2.0 	h5+c3 
编辑器的使用
1.安装插件 2.打开文件夹,创建文件夹和文件 3.项目里存在的基本的文件和文件夹 	css文件夹:存放css文件; 	html文件夹:存放除index.html文件的html文件; 	js文件夹:存放index.html文件; 	images文件夹:存放图片; 	index.html 表示首页; 
编辑器中常用的快捷键
1.显示html5基本结构的快捷键:!  回车 2.alt+shift+下	复制 
文件的命名规则
1.小写英文字母,或者英文字母、数字、连接符、下划线的组合; 2.其中不得包含汉字、空格和特殊字符;必须以英文字母开头; 3.不可以数字开头; 	注:只要是语法上的标点符号,都要使用英文输入法的符号; 
HTML的发展史
XML:可扩展标记语言 HTML:超文本标记语言 XHTML:可扩展超文本标记语言 
HTML的基本结构
<!DOCTYPE html>:文档声明,浏览器以html5版本来解析当前的代码,必须放在第一行,不区分大小写 <html></html>:根标签,根元素 <html lang="en">:定义语言;“ch”中文 <title></title>:当前文件的标题 <head></head>:头部区域,描述区 <body></body>:主体区 <meta charset = "UTF-8">:定义编码格式,字符集 
HTML5的语法
<标签 属性 = "属性值" 属性 = “属性值1 属性值2”></标签> 说明: 	1.<>里面的第一个单词,称之为标签、标记、元素; 	2.标签可以没有属性,也可以有多个属性; 	3.标签和属性之间要用空格隔开; 	4.标签有多个属性时,属性和属性之间也要用空格隔开; 	5.属性与属性值用等号连接; 	6.属性值必须卸载引号里面(可以是“ ”,也可以是’ ‘); 	7.属性有多个属性值时,属性值之间用空格隔开;  标签的两种类型:  	常规标记(双标记):又开始标签,也有结束标签 	空标记(单标记):只有开始标签,没有结束标签,自结束的<br/>可以不写 
HTML中标签之间的关系
嵌套关系 并列关系 
HTML4.01标签-文本标签,段落标签,加粗标签,倾斜标签,下划线标签
1.文本标题标签: 	<h1~h6>	一到六级标题 	h1一般放logo 	文本标题标签和网页标题标签的区别: 		显示位置不一样 		代表的含义也不一样 2.段落标签:<p></p>自带段间距 3.加粗标签:<b></b>普通加粗	<strong></strong>语义化标签,更具有强调的作用 4.倾斜标签:<i></i>普通倾斜	<em></em>语义化标签,更具有强调的作用 5.下划线标签:<u></u>普通下划线	<ins></ins>语义化标签,更具有强调的作用 6.删除线标签:<s></s>普通的删除线	<del></del>语义化标签,更具有强调的作用 7.上标:<sup></sup>	下标<sub></sub> 8.文本节点:<span></span>没有默认的样式 9.水平线标签:<hr>是单标签 10.强制换行标签:<br>单标签 11.转义字符: 	&nbsp;空格 	&lt;	< 	&gt;	> 	&copy;	版权所有 	&reg;	注册商标 浏览器更喜欢语义化标签