ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

前端DAY01-HTML

2022-08-01 20:05:55  阅读:28  来源: 互联网

标签:网页 标签 DAY01 html HTML 浏览器 前端 属性


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;	注册商标
浏览器更喜欢语义化标签

标签:网页,标签,DAY01,html,HTML,浏览器,前端,属性
来源: https://www.cnblogs.com/tender-81/p/16541631.html

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有