Web前端html5+css3前端开发入门学习笔记

文章目录

前言
HTML
- 认识HTML
- - 1. 网页组成和本质
  - 2.了解浏览器
  - 3.web标准
  - 4.HTML感知
  - 5.HTML骨架
  - 6.编译软件vscode的简介和使用
  - 7.注释
  - 8.标签组成和关系
  - 9.标题和段落
  - 10.换行和水平线标签
  - 11.文本格式化标签
  - 12.图片的基本使用和属性
  - 13.绝对路径
  - 14.相对路径的上级、同级、下级
  - 15.音频标签
  - 16.视频标签
  - 17.超链接
  - 18.实战演练
  - - 1）招聘
    - 2）跳转-index与其他页面
- HTML基础
- - 1.列表
  - - 1）使用场景
    - 2）无序和有序
    - 3）自定义
  - 2.表格
  - - 1）使用
    - 2）表格标题和表头单元格
    - 3）结构标签（了解）
    - 4）合并单元格
  - 3.表单
  - - 1）应用场景
    - 2）input的基本使用方法与占位符（提示信息）
    - 3）单选功能和默认选中
    - 4）上传多个文件
    - 5）按钮——input 与 button
    - 6）下拉菜单
    - 7）文本域
    - 8）label标签
    - 9）语义化标签
    - 10）字符实体
  - 4.实战演练
  - - 1）学生信息表
    - 2）表单
CSS
- CSS基础
- - 1.体验CSS
  - 2.CSS引入方式
  - 3.选择器
  - - 1）标签
    - 2）类
    - 3）id
    - 4）通配符
  - 4.文字基本样式
  - 5.拓展
  - - 1）层叠性
    - 2）颜色取值
    - 3）标签居中
  - 6.font复合属性
  - 7.文本缩进
  - 8.水平对齐方式
  - 9.文本修饰
  - 10.行高
  - 11.实战演练
  - - 1）新闻内容
    - 2）图片完成
- CSS进阶
- - 1.选择器
  - - 1）后代
    - 2）子代
    - 3）并集
    - 4）交集
    - 5）伪类
  - 2. emmet语法
  - 3.背景
  - - 1）背景色
    - 2）背景图
    - 3）背景平铺
    - 4）背景位置
    - 5）background的属性连写
    - 6）背景图与img的区别
  - 4.显示模式
  - - 1）块
    - 2）行内
    - 3）行内块
    - 4）转换
  - 5.拓张-标签嵌套
  - 6.CSS特性
  - - 1）继承性
    - 2）层叠性
  - 7.实战演练
- CSS盒子模型
- - 1.优先级
  - - 1）基本顺序
    - 2）叠加计算
  - 2.组成
  - 3.浏览器效果
  - 4.内容width和height
  - 5. border使用方法
  - 6. padding——多值
  - 7.内减模式
  - 8.外边距
  - 9.清除默认样式
  - 10.版心居中
  - 11.外边距的问题
  - - 1）合并现象
    - 2）塌陷现象
  - 12.行内元素的垂直内外边距
  - 13.实战演练
  - - 1）新浪导航
    - 2）新闻列表
- CSS浮动
- - 1.结构伪类
  - - 1）基本用法
    - 2）公式
  - 2.伪元素
  - 3.标准流
  - 4.行内块问题
  - 5.浮动作用
  - 6.浮动特点
  - 7.拓展——CSS属性顺序
  - 8.清除浮动
  - - 1）场景搭建
    - 2）额外标签
    - 3）单伪元素
    - 4）双伪元素
    - 5）overflow
  - 9.实战演练
  - - 1）小米布局1
    - 2）小米布局2
    - 3）导航
- 大型实战演练——学成在线项目
- CSS定位装饰
- - 1.定位
  - - 1）作用与使用步骤
    - 2）相对relative
    - 3）绝对absolute——参照浏览器
    - 4）子绝父相
    - 5）居中
    - 6）位移居中
    - 7）固定
    - 8）显示层级
  - 2. vertical-align
  - 3.光标类型
  - 4.圆角边框
  - 5.溢出显示效果——overflow
  - 6.显示隐藏——基本使用
  - 7.透明属性opacity
  - 8.精灵图的使用步骤
  - 9.背景图大小
  - 10.盒子阴影
  - 11.过渡
  - 12.骨架标签
  - 13.SEO
  - 14.favicon-标题图标
- 大型实战演练——小兔鲜项目

前言

大家好，我是李钰，是一名大二非计算机专业的学生。我正在自学计算机前端知识，目标是本科毕业进入大厂。下面是我学习中的笔记，分享给大家哈！大家一起加油！
下面是我学习的视频来源
黑马程序员前端开发入门教程，web前端零基础html5 +css3+前端项目视频教程

补充一句，这里是对这篇学习笔记的补充（一点难度较高的内容），内容来自尚硅谷

HTML

认识HTML

1. 网页组成和本质

网页是由文字、图片、音频、视频、超链接组成。

网页的本质是前端程序员写的代码，经过浏览器转化（解析和渲染）。

2.了解浏览器

浏览器是网页显示、运行的平台，前端开发必备的神器。

五大浏览器：IE、火狐、谷歌（最强）、Safar、Opera

浏览器通过渲染引擎，即浏览器的内核对代码进行解析渲染。
下面是不同浏览器的内核，内核不同，它们的加载代码的性能、速度、效果不同。

3.web标准

web标准保准不同浏览器打开的网页一样。

web标准由三个部分组成，详见下方

4.HTML感知

第一个代码！！！

5.HTML骨架

如同规则的万物一样，HTML也有自己层次分明的骨架结构。

简单说，从上至下，html整体、head头部、title标题、body身体。

6.编译软件vscode的简介和使用

官网下载vscode

请自行下载观看使用说明。

7.注释

注释很重要，是为了帮助下次阅读代码者的快速理解。

快捷键是ctrl+/，一次变为注释，再一次取消。

8.标签组成和关系

标签一般由开始标签、包裹内容、结束标签。

单标签：< br > 、< hr >

关系：嵌套、并列

9.标题和段落

每个文章都需要标题，且标题的数量和重要性不一。

代码：< h1>一级标题< /h1 >
标题由h1到h6，标题的重要性依次降低，大小依次减小。

段落也是经常出现。
代码：< p > 内容 < p >

10.换行和水平线标签

作用：强制让文字换行
代码：< br >

作用：可以在文字和标题之前由水平分割线
代码：< hr >

11.文本格式化标签

右边在突出重要的强调语境时使用。使用时效果左右两者一样。

12.图片的基本使用和属性

作用：使用图片
代码：< img src=" " alt= " " >

13.绝对路径

作用：找到文件，如图片文件、视频文件、音频文件等

这是指目录下的绝对位置，可直接到达目标位置，通常从盘符开始的路径。

14.相对路径的上级、同级、下级

作用：找到文件，如图片文件、视频文件、音频文件等

这个是指从当前文件出发，找到目标文件的过程。因此产生了三种关系：上级、同级、下级。
代码同级：src = " ./路径"
下级：src=" 文件夹名/图片文件名"
上级：src=" …/文件夹名/图片文件名"
./是进入下一级，…/是进入上一级

15.音频标签

作用：引入音频

代码：< audio src=" " controls > < /audio >
属性如下：

16.视频标签

作用：引入视频

代码：< video src=" "> < /video >
属性如下

17.超链接

作用：引入链接

代码：< a href=" ">超链接< /a >
注意：1.当不知道跳转链接时，可以填写#，表示空链接
2.超链接唯一自带颜色的链接。
3.href本质是跳转地址。

属性如下

18.实战演练

1）招聘

代码如下：

<!DOCTYPE html>
<html lang="en"><head><title>dayone</title></head><body><h1>腾讯开发招聘</h1><hr><h2>职位描述</h2><p>负责一方面内容</p><h2>岗位要求</h2><p>5年以上的开发经验</p><p>熟悉操作系统</p><p>对web熟悉</p><h2>工作地址</h2><p>杭州市</p><img src="../img/map.jpg" alt=""><!-- 这里是我电脑上的路径，有需要可以自换 --></body>
</html>

效果如下：

2）跳转-index与其他页面

index.html

<h1>这是首页面index</h1>
<a href="two.html" >到two页面</a>

one.html

<video src="sample.mp4" controls loop>视频</video>
<audio src="sample.mp3" controls loop>音频</audio>

two.html

<h1><a href="one.html">到one页面</a></h1>

HTML基础

1.列表

1）使用场景

应用在内容规则排序的情况下。

对内容顺序无要求使用无序列表，有先后要求用有序列表，另有其他需求使用自定义列表。

2）无序和有序

无序列表
注意：不想要小点时，可以改变ul的css属性，即list-style : none ;
有序列表

3）自定义

2.表格

1）使用

属性如下

2）表格标题和表头单元格

3）结构标签（了解）

在视觉上没有任何区别，主要是为了计算机能够快速理解和处理。

4）合并单元格

3.表单

1）应用场景

在登录、注册、搜索区域时使用。

2）input的基本使用方法与占位符（提示信息）

intput的基本使用方法。

占位符

3）单选功能和默认选中

4）上传多个文件

5）按钮——input 与 button

reset标签要与form配合使用。

在button中value属性名的属性值时按钮上的字。

button和input之间的实现功能的区别，请看下面链接

6）下拉菜单

7）文本域

8）label标签

9）语义化标签

没有语义的标签

有语义的标签

10）字符实体

因为网页不认识多个空格，只认识一个空格，所以需要字符实体来控制。

4.实战演练

1）学生信息表

<!DOCTYPE html>
<head><title>优秀学生表格</title>
</head>
<body><table border="1"  width="600" height="300"><caption><h3>优秀学生表格</h3></caption><tr ><th>年纪</th><th>姓名</th><th>学号</th><th>班级</th></tr><tr><th rowspan="3">高三</th><th>张三</th><th>119</th><th>四班</th></tr><tr><th>李四</th><th>110</th><th>五班</th></tr><tr><th>王五</th><th>666</th><th>一班</th></tr><tr><td><strong>评语</strong></td><td colspan="3"><strong>三好学生</strong></td></tr></table></body>
</html>

2）表单

<!DOCTYPE html>
<head><title>表单练习</title>
</head>
<body><div><h1>李钰相亲网</h1></div><hr><form action="">昵称：<input type="text" name="" id="" placeholder="请输入昵称"><br><br>性别：<label ><input type="radio" name="sex" id="" checked>男</label><label ><input type="radio" name="sex" id="">女</label><br><br>所在城市：<select name="" id=""><option value="">上海</option><option value="">北京</option><option value="" selected>郑州</option></select><br><br>喜欢的类型：<label ><input type="checkbox" name="" id="">可爱</label><label ><input type="checkbox" name="" id="">清纯</label><label ><input type="checkbox" name="" id="">性感</label><label ><input type="checkbox" name="" id="">妩媚</label><br><br>个人介绍：<br><textarea name="" id="" cols="60" rows="20"></textarea><div><h3>我承诺</h3></div><ul><li>本人英俊潇洒</li><li>已满18，单身</li><li>性格敦厚，好男人一个</li></ul><br><br><input type="checkbox" name="" id="">同意共享信息<br><br><!-- button --><input type="submit" value="免费注册"><br><br><div><button type="reset">重写</button></div></form>
</body>
</html>

CSS

CSS基础

1.体验CSS

CSS一般写在style标签里面的，style一般在head里面。

格式如下：

2.CSS引入方式

CSS引入方式有嵌入式、外联式、内联式。

3.选择器

1）标签

2）类

3）id

4）通配符

4.文字基本样式

5.拓展

1）层叠性

即后面的覆盖前面的，在CSS的样式中，往往取最后的颜色、字体、大小等展现，而非前面的几个的样式。

2）颜色取值

3）标签居中

6.font复合属性

7.文本缩进

8.水平对齐方式

注意：居中的元素有文本、span、a、input、img标签。它们的父级添加标签。

9.文本修饰

10.行高

11.实战演练

1）新闻内容

<html><head><title>practice3</title><style>p{color: #000;}.one{color: #000;width: 600px;height: 600px;margin: 0 auto;}.center{text-align: center;}.color1{color: blue;font-weight: 700;}.color2{color:red;text-decoration: underline;}.two{text-indent: 2em;}</style></head><body><div class="one" ><h2 class="center">《自然》评选改变科学的10个计算机代码项目</h2><p class="center"><span>2022.10.12 22:45报 李钰</span><span class="color1">新华社</span><span class="color2">请收藏关注</span><hr></p><p class="two">2019年，事件视界望远镜团队让世界首次看到了黑洞的样子。不过，研究人员公布的这张发光环形物体的图像并不是传统的图片，而是经过计算获得的。利用位于美国、墨西哥、智利、西班牙和南极地区的射电望远镜所得到的数据，研究人员进行了数学转换，最终合成了这张标志性的图片。研究团队还发布了实现这一壮举所用的编程代码，并撰文记录这一发现，其他研究者也可以在此基础上进一步加以分析。  </p><p class="two">如果没有能够解决研究问题的软件，以及知道如何编写并使用软件的研究人员，一台计算机无论再强大，也是毫无用处的</p><p class="two">这种模式正变得越来越普遍。从天文学到动物学，在现代每一项重大科学发现的背后，都有计算机的参与。美国斯坦福大学的计算生物学家迈克尔·莱维特因“为复杂化学系统创造了多尺度模型”与另两位研究者分享了2013年诺贝尔化学奖，他指出，今天的笔记本电脑内存和时钟速度是他在1967年开始获奖工作时实验室制造的计算机的1万倍。“我们今天确实拥有相当可观的计算能力，”他说，“问题在于，我们仍然需要思考。”</p></div> </body>
</html>

2）图片完成

<html><head><title>practice4</title><style>body{background-color: aliceblue;}.good{width: 234px;height: 600px;background-color: aliceblue;margin: 0 auto;text-align: center;}img{width: 180px;height: 200px;}</style></head><body><div class="good"><img src="../../img/OIP-C.jpg" alt=""><p class="good" style="font-weight: 700;">小米七号热水壶   </p>        </p></div></body>
</html>

CSS进阶

1.选择器

1）后代

2）子代

3）并集

4）交集

5）伪类

2. emmet语法

3.背景

1）背景色

2）背景图

3）背景平铺

4）背景位置

5）background的属性连写

这里的连写顺序不如font一样强制，但推荐顺序如下

6）背景图与img的区别

img一般在使用重要的图片时用，不重要的图使用div+img。

4.显示模式

为了在开发网页中有多种显示方式。

1）块

2）行内

3）行内块

4）转换

5.拓张-标签嵌套

6.CSS特性

1）继承性

注意：继承也会有例外的情况，如果子元素自带特定的特点，则不会继承相应的父元素特点。如由于超链接具有自己的颜色，所以颜色不会继承。h1等不会继承font-size。

2）层叠性

7.实战演练

<html><head><title>practice1</title><style>a{text-decoration: none;width: 100px;height: 50px;background-color: red;display: inline-block;color: aliceblue;text-align: center;line-height: 50px;}a:hover{background-color: orange;}</style></head><body><a href="#">导航1</a><a href="#">导航2</a><a href="#">导航3</a><a href="#">导航4</a><a href="#">导航5</a></body>
</html>

<html><head><title>practice2</title><style>a{width: 100px;height: 50px;text-decoration: none;background-color: pink;display: inline-block;text-align: center;line-height: 50px;color: #000;font-weight: 700;background-repeat: repeat-x;background-position: center center;}.one{background-image: url(../../img/橙色.png);}.two{background-image: url(../../img/紫色.png);}.three{background-image: url(../../img/红色.png);}.four{background-image: url(../../img/绿色.png);}.one:hover{background-image: url(../../img/map.jpg);}.two:hover{background-image: url(../../img/map.jpg);}.three:hover{background-image: url(../../img/map.jpg);}.four:hover{background-image: url(../../img/map.jpg);}</style></head><body><a href="#" class="one">导航1</a><a href="#" class="two">导航2</a><a href="#" class="three">导航3</a><a href="#" class="four">导航4</a></body>
</html>

CSS盒子模型

1.优先级

1）基本顺序

2）叠加计算

2.组成

3.浏览器效果

<html><head><title>text2</title><style>div{width: 300px;height: 300px;background-color: pink;border: 1px solid #000;padding: 20px;margin: 50px;}</style></head><body><div>内容模块</div><div>内容模块</div></body>
</html>

4.内容width和height

5. border使用方法

如果想要盒子的一边显示

盒子边框的属性如下

6. padding——多值

可以通过padding: 上右下左来设置padding内边距区域的上下左右的大小。

7.内减模式

8.外边距

可以通过margin: 上右下左来设置margin外边距的上下左右的大小。

9.清除默认样式

10.版心居中

版心即有效内容，使版心居中在布局上更为美观，一般可以用外边距来实现，即margin：0 auto ;

11.外边距的问题

1）合并现象

2）塌陷现象

12.行内元素的垂直内外边距

问题：如果想要通过padding或margin改变行内标签的垂直位置，无法生效。

方法：使用line-heigt来改变。

13.实战演练

1）新浪导航

<html><head><title>新浪导航</title><style>.box{height: 40px;border: bottom 1px solid #b7bac0 ;border-top: 3px solid orange;}.box a{padding:0 16px 0 16px;height: 40px;display: inline-block;text-align: center;line-height: 40px;font-size: 24px;color: #4c4c4c;text-decoration: none;font-weight: 400;}.box a:hover{background-color: #cfcfcf;color: orange;}</style></head><body><div class="box"><a href="#">首页</a><a href="#">手机新浪网</a><a href="#">新浪导航</a><a href="#">加入我们</a></div></body>
</html>

2）新闻列表

<html><head><title>新闻案例</title><style>*{margin: 0;padding: 0;box-sizing: border-box;}.new{width: 500px;height: 400px;border: 1px solid #000;margin: 50px auto;padding: 42px 30px 0;}.new h2{font-size: 30px;border-bottom: 1px solid #ccc;line-height: -10px;padding-bottom: 9px;}ul{list-style: none;}.new li{height: 50px;border-bottom: 1px dashed #ccc;padding-left: 28px;line-height: 50px;}.new a{text-decoration: none;color: #666;font-size: 18px;}.new li:hover{background-color: antiquewhite;}</style></head><body><div class="new"><h2>最新文章/New Articles</h2><ul><li><a href="#">北京的新闻</a></li><li><a href="#">上海的新闻</a></li><li><a href="#">广州的新闻</a></li><li><a href="#">深圳的新闻</a></li><li><a href="#">杭州的新闻</a></li></ul></div></body>
</html>

CSS浮动

1.结构伪类

1）基本用法

2）公式

2.伪元素

3.标准流

4.行内块问题

问题：浏览器解析行内块或行内标签的时候，如果标签换行书写会产生一个间距。

5.浮动作用

使元素脱离文档流，按照指定的方向发生移动，遇到父级的边界或者相邻的浮动元素就会停下来.

浮动的目的：为了达到自己的布局目的，让指定元素定位在指定位置，并且可以设置浮动后的行级元素的宽高，我们就需要用到浮动

6.浮动特点

7.拓展——CSS属性顺序

1.浮动/display
2.盒子模型：margin border margin padding 宽度高度背景色
3.文字样式

原因：浏览器的执行效率更高

8.清除浮动

1）场景搭建

2）额外标签

3）单伪元素

4）双伪元素

5）overflow

9.实战演练

1）小米布局1

<html><head><title>practice1</title><style>.header{height: 40px;background-color: #000;color: red;text-align: center;font-weight: 400;font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;font-size: large;line-height: 40px;}.content{background-color: pink;width: 1226px;height: 100px;margin: 0 auto;}.one{width: 1226px;height: 460px;background-color: green;margin: 0 auto;}.left{width: 234px;height: 460px;background-color:orange ;float: left;}.right{width: 992px;height: 460px;background-color: skyblue;float: left;}</style></head><body><div class="header">首页</div><div class="content"></div><div class="one"><div class="left"></div><div class="right"></div></div></body>
</html>

2）小米布局2

<html><head><title>practice2</title><style>*{margin: 0;padding: 0;}.box{width: 1226px;height: 614px;background-color: #ffff；margin: 0 auto;}.left{float: left;width: 234px;height: 614px;background-color: orange;}.right{float: right;width: 978px;height: 614px;background-color: #ffff;}ul{list-style: none;}.right li{float: left;width: 234px;height: 300px;background-color:skyblue;margin-right: 14px;margin-bottom: 14px;}.right li:nth-child(4n){margin-right: 0;}</style></head><body><div class="box"><div class="left"></div><div class="right"><ul><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li></ul></div></div></body>
</html>

3）导航

<html><head><title>practice3</title><style>*{margin: 0;padding: 0;}ul{list-style: none;}ul li {float: left;}.one ul li a{text-decoration: none;width: 80px;height: 50px;background-color: pink;display: inline-block;color: aliceblue;text-align: center;line-height: 50px;font-weight: 400;font-size: 16px;}.one ul li a:hover{background-color: orange;}.one{margin: 50px auto;width: 640px;height: 50px;background-color: pink;}</style></head><body><div class="one"><ul><li><a href="#">新闻1</a></li><li><a href="#">新闻2</a></li><li><a href="#">新闻3</a></li><li><a href="#">新闻4</a></li><li><a href="#">新闻5</a></li><li><a href="#">新闻6</a></li><li><a href="#">新闻7</a></li><li><a href="#">新闻8</a></li></ul></div></body>
</html>

大型实战演练——学成在线项目

代码如下
链接：https://pan.baidu.com/s/1INVmUmlMr4U5UB49GuruzQ
提取码：15ht
成品如下

CSS定位装饰

1.定位

1）作用与使用步骤

网页布局的方式共三种，具体如下

2）相对relative

注意：left 与right同时存在时，以left为准。同理，top与bottom同时存在时，以top为准。

3）绝对absolute——参照浏览器

注意：此类先找已经定位的父级，依次为参照物进行移动。如果没有。就以浏览器窗口为参照物。

还有使用此类属性会使其脱标，不占位置。也改变了标签的显示特点，使其具有行内块的特点。

此外绝对定位的盒子不能用margin: 0 auto;居中

4）子绝父相

一般我们会对父级进行相对定位，子级进行绝对定位，这样配合使用可以是子级在父级内相对移动。
同时，值得注意的是父级是一个广泛的概念，非直接的父级元素也是参考此的。在子级寻找父级定位时，会由近及远，主机查找已定位的父级元素，如果查找不到就以浏览器窗口为参照进行定位。

5）居中

/*水平居中*/
/*整个盒子移动到浏览器中间偏右的位置*/
left:50%;
/*把盒子向左侧移动：自己宽度的一半*/
margin-left:-150px;/*垂直居中*/
/*整个盒子移动到浏览器中间偏下的位置*/
top:50%;
/*把盒子向上侧移动：自己宽度的一半*/
margin-top:-200px;

6）位移居中

/*位移：自己宽度高度的一半*/
transform:translate(-50%,-50%);

7）固定

8）显示层级

注意：在默认情况下，定位的盒子后来者居上。

在使用定位的情况下，可以使用z-index：整数；，取值越大，显示顺序越靠上。默认值为0

2. vertical-align

基线：浏览器文字类型元素排版中存在用于对齐的基线（baseline）

值得注意的是，浏览器处理行内标签，处理行内块时是按照与文字类型一样的方式来处理。

3.光标类型

4.圆角边框

5.溢出显示效果——overflow

6.显示隐藏——基本使用

visibility:hidden;是占位隐藏
display: none ;是不占位隐藏

7.透明属性opacity

8.精灵图的使用步骤

9.背景图大小

10.盒子阴影

11.过渡

12.骨架标签

    <!-- 兼容IE与edge浏览器 --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!-- 宽度=设备宽度：移动端网页开发 --><meta name="viewport" content="width=device-width, initial-scale=1.0">

13.SEO

SEO三大标签

14.favicon-标题图标

大型实战演练——小兔鲜项目

代码在网盘里哈
链接：https://pan.baidu.com/s/1INVmUmlMr4U5UB49GuruzQ
提取码：mrx0
成果如下

补充一句，这里是对这篇学习笔记的补充（一点难度较高的内容），内容来自尚硅谷

Web前端html5+css3前端开发入门学习笔记相关推荐

java web开发入门学习笔记（手打超细版）
我刚实习的时候写的,先分享分享吧,当时写的也不容易.有错的话请指出,博主会修正,适合入门小白当资料使用.包括包括java基础.数据库.js.jQuery.css.html等等知识点. 详细笔记内容如下 ...
Unity3D游戏开发入门学习笔记
学习内容概要: 软件面板功能.材质球.预制体.摄像机.灯光.鼠标键盘输入.组件.刚体.碰撞体.PC端游戏打包发布.... 第1课:课程介绍与Unity3D环境搭建 1.Unity3D,一个游戏开发引擎 ...
安卓开发入门学习笔记
第一天 1.LinearLayout,线性布局 vertically :垂直,纵向 horizontally:水平,横向 a:方向,默认横向 android:orientation="h ...
Arduino 开发入门学习笔记 Arduino编程基础
11月2日至5日事务缠身 11月6日继续坚持 Arduino语言其实是基于C/C++的嵌入式设备开发框架,核心库文件提供的API使传统开发方式中各个寄存器的意义以及寄存器配置过程变得透明. 增强 ...
Android NDK开发入门学习笔记(图文教程,极其详尽)
以前也简单用过JNI,但是只是简单用一下,好多都不明白.最近在看源码部分,有涉及到JNI调用的,所以这次打算彻底把它搞定. 先普及一下JNI的调用关系:JAVA-------------------- ...
python 50 前端 html5 css3
1 # 前端 2 3 接下来我们进入前端知识的学习,前端的学习目的就是为我们开发的应用程序提供一个与用户进行交互的界面,前端分为HTML5.CSS3.JavaScript三大部分,我们学习内容共分 ...
web前端开发入门学习线路图详解-2019升级版
现如今,Web前端工程师已经成为各大互联网公司不可或缺的热门职位,从业者队伍日渐庞大,这其中不乏零基础学习者和转行人士.为了方便大家系统而全面的掌握前端基础知识,千锋小编特意整理了web前端开发入门学 ...
Web前端开发入门学习分享
Web前端开发入门学习分享 1:如何开始学习Web前端首先你需要学习html的各个标签,掌握其用法和规范,明白其作用. 开始学习css的使用,你先学习在html页面中为标签增加css样式,其次是将c ...
尚硅谷新版Web前端HTML5+CSS3知识点集合篇【p1-p8】
尚硅谷新版Web前端HTML5+CSS3知识点集合笔记篇尚硅谷新版Web前端HTML5+CSS3全套基础教程完整版(初学者零基础入门) p1(22:55) 一.软件的分类: 1.系统软件 -wind ...