前端与服务器的联系
编写代码的常用编辑器
所有编辑器的编写和文件保存目录以及文件名都应基于英文状态下
且新建文本应修改后缀名
- sublime
编辑器的网页预览可在编译界面右击选择open in browser
或在文件夹位置右击选择不同浏览器查看预览效果
常用快捷键:
ctrl+f:查找代码或文本内容并快速定位
ctrl+enter:快速切换到下一行
ctrl+alt+l:将代码格式恢复标准,格式化代码
<html:5+Tab:快速输入html基本格式框架
<!+Tab/ctrl+e:快速输入html基本格式框架 - Hbuilder
此编辑器的预览有多种方式:
可在界面右上方点击下载在线预览插件进行实时预览
可在界面左上方预览图标进行预览 - VScode
在左侧插件下载位置下载浏览器预览插件
然后编写界面右击点击预览命令选择浏览器进行预览
网页预览常用浏览器
- chrome—谷歌
- firefox—火狐
- opera—欧鹏
- safari
- ie
- …
HTML的基本格式
<!DOCTYPE html> <!--文档类型-->
<html lang="en"> <!--文档语言,en为英文-->
<head> <!--头部信息,起始位置-->
<meta charst="UTF-8"> <!--UTF-8表示西欧字符集,涵盖中文字符-->
<title>标签信息</title> <!--文档页签显示名称-->
</head> <!--头部信息显示结束-->
<body> <!--文档正式显示内容-->
文档显示内容
</body>
</html>
HTML文档结构内常用标签
<!DOCTYPE heml>
<html lang="en">
<head>
<meat charset="UTF-8">
<tittle>标签</tittle>
</head>
<body>
<font size="15">字体标签</font>
<font face="幼圆">字体标签</font>
<font color="green">字体标签</font>
<!--注释标签(div模块标签)-->
<div>
<!--标题可分6个等级-->
<h1>标题标签1</h1>
<h2>标题标签2</h2>
<h3>标题标签3</h3>
<h4>标题标签4</h4>
<h5>标题标签5</h5>
<h6>标题标签6</h6>
<span>文本标签</span>
<label>文本标签</label>
<p>
此处可添加段落文字
</p>
<p>
段落标签用于文本分段
</p>
</div>
<!--绝对路径:本地文件地址-->
<img src="D:\办公文件\素材库\图片\创意">
<!--a*n可生成多个超链接-->
<a href="https://blog.csdn.net/">csdn</a>
</body>
</html>
浏览器预览结果:
代码展示可利用Gitee码云上传
上传步骤:
- 注册登录
- 网站右上角点击“+”选择新建仓库
- 在新建仓库界面可上传代码、图片、文件或文件夹等
- 上传图片或代码可直接点击文件选项选择上传文件
- 在上传文件界面可将文件拖至上传选框内,或点击选框选择要上传的文件
- 上传完成后在上层菜单栏选择“服务”点击选择“Gitee Pages”,然后滑动页面至底部点击启动,等待启动成功后出现网页链接,即可复制链接查看内容。
(查看图片链接时须在连接后添加图片名)
7.上传文件夹内容时,若文件夹内分多个文件夹,要先在“文件”选项下新建文件夹,在新建文件夹下按照本地路径依次建立内部文件夹再上传文件。
Windows 10系统更新或重装
具体参照:win 10 系统恢复出厂设置和重装方法