前端开发
用前端技术实现用户界面
前端技术:基础三大要素 html5 css3 javascript +js衍生物(vue,react,angular框架,node.js)
用户界面:pc端 + 移动端app (页面+交互+数据渲染)
发展史
web1.0阶段 蒂姆·伯纳斯·李 [1] (Tim Berners-Lee) 界面:只能读 不能写
web2.0阶段 布兰登·艾奇(Brendan Eich,1961年~) JS 有了交互 只能读 还能写 建设者
web3.0阶段(大前端) 09年 Ryan Dahl
浏览器及其内核
浏览器=外壳+内核
五大浏览器
基本代码的表示(vscode)
标题
<h1>标题内容</h1> 有且只有一个 一般用在logo 作用:网站权重<h2>标题内容</h2><h3>标题内容</h3><h4>标题内容</h4>
图片的路径
1.绝对路径1)网络上的图片2)本地绝对路径的图片2.相对路径根目录 / (编辑器里打开的文件夹的顶级目录)同级目录 ./ 或者不写上级目录 ../ 跳出本文件夹至上一个文件夹上上级目录 ../../跳出2个文件夹<img src="1.jpg" alt="">alt:当图片加载失败的文本提示title:鼠标悬停时的文本提示width:宽度 等比例缩放 3:2 height:高度
修饰文字
加粗
<b>adsaudf</b> bold 非语义标签<strong>safsf</strong> 语义化标签 装重要的 强调的文字 希望被爬虫抓取
斜体
<i>斜体文字</i> italic 斜体<em>斜体文字</em> 语义化标签
下划线
<u>aefresf</u><ins>ftrewtet</ins>语义化标签
中划线
<s>99.00</s><del>99.00</del>语义化标签
换行
给段落内的文字换行
<br> break
水平线
<hr color="red" align="" width="300px">align 水平对齐方式 left 左对齐 right center居中
字符实体
版权符 人民币符 > < . “” —》Unicode编码
人民币符 ¥
¥ 人民币符号©版权符 > 大于号<小于号
布局标签
大盒子大容器 大区域
<div></div> 可以装div,img p hi....
小容器 小盒子 小区域
<span></span> 可以装几个字 小图标 非常小的图片