学习网站推荐：
http://c.biancheng.net/
复习
web前端 --> 写一个网页/网站给用户看
为什么要学习前端 --> 1.培养基本的权重能力
2.后续课程对前端技术有一定要求(爬虫/web开发)
后续做的爬虫,web网站,小程序. 除了有后端功能之外.也是有一定前端界面.所以需要了解学习前端
切记,我们学习的重点还是放在后端为主.前端只是补充
前端三剑客:
html超文本标记语言 -->
超文本: 比普通文本更厉害.有图片,音乐,视频,超链接.还可以进行排版布局
标记语言: 功能目的是给用户观看,而不是做一些功能逻辑开发. 内容是用来看的. 代码是以标签的形式书写
css层叠样式表 -->
美化网页内容(排版,颜色,大小,性能优化)
让网页看起来更好看,性能更好
JavaScript -->
编程语言/脚本语言 --> 主要做动态样式/前后端交互
学习内容:
前端三剑客 + jQuery + bootstrap + ajax
由于不是主攻前端. 所以前端一些比较新的,主流的技术我们并没有讲.如果为有需求的话,可以等全栈班学完,基础打牢固了. 自行拓展
Vue,React node.js
html里的代码称为标签:
标签分为两种:
1.单标签: 作为功能标签使用.实现特定功能<标签名>
<img> 图片
<hr> 分割线
<br> 换行
<link> 导入文件 --> css
2.双标签: 一般用来包裹内容.会有一个闭合符号/ 写在结束标签里 <标签名>内容 </标签名>
p,span,div,a,ul,li,h1
网页的三大核心标签:
<html></html> : 网页的核心标签.网页内容都写它里面
<head></head> : 头标签.里面写的内容主要是给浏览器看的. 网页信息/名字/属性设置
<body></body>: 身体标签.里面的内容主要是写给用户看的
语义化:
代码写的是否规范.有的标签效果相同,但是语义性不同
<b> --> 只是看了字变粗了,但是对于浏览器来说.这个还是一个普通的内容.不会强调在意它
<strong> --> 字体加粗的同时,起到了强调作用. 搜索引擎/爬虫/浏览器会优先检索它的内容
写在head里的辅助标签:
<meta>: 元标签,主要用来写网页的说明信息.设置信息
<link>: 链接标签.主要用来链接外部文件(css)
<title>: 标题标签
<style>: 样式表标签.可以把css样式写里面
写在body里的标签:
1.文本标签:
<p> 段落标签.自带换行
<span> 文本标签.没有语义性,不会换行. 一般结合css使用
<h1>-<h6> 1-6级的标题标签
<b>&<strong> 粗体标签
<i>&<em> 斜体标签
<u>&<ins> 下划线标签
2.功能标签:
<br> 换行
<hr> 分割线
3.超链接a标签:
a标签的作用是可以让网页跳转到一个指定的位置
1.一个指定的网址(微博,贴吧,cxy521)
2.当前页面的指定位置
3.指定的文件
<a href='跳转位置'> 描述内容 </a>
<a href='http://c.biancheng.net/css3/'> 点我去学习 </a>
可以给标签设置id.再通过id名跳转到一个指定的位置
<a href='#water'> 点我去喝热水 </a>
<p id='water'>多喝热水</p>
4.图片img标签:
img四要素:
src: 图片路径 可以使用绝对/相对/网络路径
alt: 图片的描述,给爬虫看的
width: 图片的宽
height: 图片的高
<img src='图片路径' alt='图片描述'>
<img src="沙雕图.jpg" alt="">
5.列表标签:
在网页里显示一些带关联性的数据
有序列表/无序列表的子元素.内容都是写在li标签里的,不要写在ol/ul里
ul>li -- 无序列表.默认样式为黑点
<ul>
<li></li>
<li></li>
</ul>
ol>li -- 有序列表,默认样式为数字
<ol>
<li></li>
<li></li>
</ol>
dl>dt>dd -- 自定义列表. dl是容器 dt是标题 dd是内容.主要用在双层目录. dd基于dt有个缩进
<dl>
<dt></dt>
<dd></dd>
<dd></dd>
</dl>
6.div盒子标签:
div标签本身没有语义性.适合用来加样式,划分网页区域实现布局的效果.
更好的实现布局: 左中右 / 上中下
盒子标签的内容:
外边距 -- 边框 -- 内边距 -- 内容
盒子标签默认是没有宽高,颜色这些属性.是看不到的,需要设置样式才可以
width:宽度,常用单位为像素
height:高度,常用单位为像素
background-color: 背景颜色
margin: 外边距
padding: 内边距
overflow: 溢出内容处理
border: 边框
设置盒子左右居中: margin: XX auto;
css:
层叠样式表 --> 让网页变得更好看,加特效做排版
html是写个网页出来.css是找到网页里的内容.加特效:
1.怎么找
2.加什么
选择器 --> 找到标签的方式
*: 通配符选择器. 选中所有标签
标签选择器: 选中指定的标签
class选择器: 先给标签设置class属性.在样式表中通过 .class名的方式指定标签
id选择器: 先给标签设置id属性.在样式表中通过 #id名的方式指定标签
tips:
1.标签选择器一般是用来清除/初始化默认样式
2.id是唯一的,class可以有多个
样式表的写法:
1.行内样式表 -- 把样式写在标签里.权重最高.用的最少
2.内部样式表 -- 把样式写在head标签里的style标签中. 学习阶段用的多
3.外部样式表 -- 把样式写在专门的.css文件里.通过link标签导入.开发阶段用的多
文本样式:
color: 字体颜色(单词/十六进制/rgb)
font-size: 字体大小 (px/em)
font-family: 文字字体
font-weight: 文字粗线 100-900
font-style: 文字样式
text-indent: 文字缩进 2em =2个字的大小
text-align: 文字对齐(左/中/右)
text-decoration: 文字样式(下划线,上划线,删除线)
line-height: 文字行高.文字的上下位置
背景样式:
background
background-color: 背景颜色
background-image: 背景图片 url(图片路径)
background-size: 背景大小
background-position: 背景位置
边框样式:
border: 3px solid #6cf; 粗细 样式 颜色
border-width: 边框粗细
border-style : 边框样式
border-color: 边框颜色
border-radius: 边框圆角
排版样式:
margin -- 外边距.当前对象距离外面的距离
padding -- 内边距,当前内容距离容器边框的距离
边框/排版都可以单独设置4个方向的值
top上 right右 bottom下 left左
比如 margin-left 左外边距 padding-top上内边距 border-left左边框
标签属性:
1.块元素(block): 主要用来布局.把网页分割成多块.独占一行,有独立的宽高.默认的宽度为浏览器的100%.高度为内容大小(div,p,h1-h6,ul,ol,li,dl,dt,dd)
2.行内元素(inline): 主要用来表示内容.没有独立的地盘.宽高就是自身大小.不会独占一行,多个行内元素挤在一起的 (span a b img)
3.行内块元素(inline-block): 兼具块与行内的特点. 可以用做来水平横向布局
display: 类型转换
display: block;
inline;
inline-block;
none;html/css规范
1.排版规范: 子级都加个缩进,不要代码麻麻烦烦的写一起. 适当的空格,缩进,换行
2.命名规范: 见名知意.取名字可以参考两个文档文件
3.书写规范:
1.选择器的书写顺序:
* > 标签选择器 > class/id选择器
2.样式书写顺序:
1.位置样式: display overflow list-style
2.自身样式: width height border margin pading
3.文本样式: color text- font-
4.其他/新增样式: transform , box-shadow
计算机硬件
电脑的大致分类:
1.台式机 --> 性能更好.相对来说更划算. 不便移动
2.笔记本电脑 --> 性能没台式机好. 但是可以随时携带.
3.平板电脑 --> 不属于正经电脑
主要讲的内容.是基于笔记本,因为台式电脑的水很深
用笔记本的同学.可以拿两个瓶盖,把笔记本垫起来/买个烧烤架子
笔记本分类:
1.游戏本(性能本): 性能比较好,比较笨重.续航比较差
有大型游戏/专业软件(pr,ae,虚拟机)需求的话.需要游戏本
2.轻薄本(办公本): 性能相对较弱,比较轻便.续航较好
如果办公,看视频,写代码,中小游戏
3.全能本(全都不能本): 有性能但不如游戏本. 有便携但不如轻薄本
如果两方面需求都一般,那可以考虑全能本
笔记本购买事项:
平台:
京东 --> 价格较贵,售后/发货较好
淘宝 --> 中等
pdd --> 价格较便宜,售后不太可
激活:
如果买了新电脑,开机激活系统之后,基本不能退换.
所以买了电脑开机之前,先看视频了解下怎么跳过激活系统
录屏
电脑到了后.开箱/收件过程全程录屏.避免电脑有问题,作为证据
线下店:
大部分的线下店都是骗人的,坑人的. 尤其是坑熟人
没有特殊情况不推荐去线下店.
1.想摸一下/看一下电脑的质感.
2.不要带钱/去了也不要听对方BB
老麟:
买电脑之前,可以稍微问下我.
笔记本段位:
一线: 联想 戴尔 华硕 惠普
二线: 苹果 宏碁 华为 小米 机械革命 微星
三线: 神舟 火影 雷神 炫龙
买电脑尽量买一线产品.
相对来说品控/售后较稳定
如果是电脑小白,不推荐买3线产品
cpu:
中央处理器 -- 相当于人类的脑子. 计算机会把数据都交给cpu进行运算处理.你的cpu越好.处理速度就越快
cpu主要有两个产商:
intel: 因特尔 --> i开头的酷睿系列 目前最新13代 9代往后都还ok, 4-8凑合 4之前老
amd: 按摩店 --> r开头的锐龙系列 目前最新7代. 3代往后都OK.之前的凑合. 不是r开头的,有点老
i7-12700H --> 酷睿高级型 第十二代 性能指数700
i5-9400F --> 酷睿普通型 第九代 性能指数400
R5-5500U --> 锐龙普通型 第五代 性能指数500
cpu的规格:
i3 / r3 --> 入门型
i5 / r5 --> 普通型
i7 / r7 --> 高级型
i9 / r9 --> 旗舰型
cpu的代数 --> 规格后面的第1/2个数字
性能指数 --> 代数后面的数字.越高越好
后缀:
H: 标压CPU.性能比较强,比较耗电 --> 游戏本
U: 低压CPU,性能弱一点,不太耗电 --> 办公本
P: 介于H和U.有点性能,也不那么耗电 --> 办公本/全能本
K: 可以超频.底子是H.然后可以超常发挥. 影响寿命
怎么看CPU:
1.先看产品
2.再看代数
3.再看规格
4.再看性能指数
5.最后看后缀
534
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
