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.转义字符:
 ;空格
< <
> >
© 版权所有
® 注册商标
浏览器更喜欢语义化标签
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
评论(0)