前端开发入门教程，web前端零基础html5 +css3+前端项目视频教程

最我无风:
这下好了，别人都知道我零基础[大笑]，还想学IT[傲娇]，还想月薪过万[嘘声]。[doge]

【回复】知道就知道呗，证明给他们你能行！
【回复】回复 @黑马程序员 :你知道嘛！你们和出版社编写的书我们学校在用，你可真是个机灵鬼哈，👴🏻宿舍地上都是头发
【回复】谁让你不带耳机，扬声器还贼大声[大笑]
自小车:
这老师讲的比我大学老师讲的清楚多了，而且还有趣，大学老师只会念课本ppt，我怀疑我上了假大学

【回复】确实，而且我这老师更恶心，期末大作业只能按平时教的知识点写，课外的不给分。他讲的快的一批而且根本不系统。也不讲项目怎么做
【回复】大学就是这样的[辣眼睛]
【回复】兄弟有木有看之前1000W的2019-12-21的教程，哪一个好些
吃个大大的大西瓜:
2022年1月26日，完成课程学习，并附有学习笔记： https://mouday.github.io/coding-tree/#/blog/front-end-learn/index

【回复】我学完这套课程，能做出你这个样子吗？（渴望）（渴望）（渴望）
斩天King:
女神的就业班视频什么时候出呀[微笑]然后为什么感觉pink老师讲的更全，我同学看pink老师的视频懂得比我多，什么3d2d动画、响应式布局、移动端开发、所以我现在很慌，也突然迷茫了不知道怎么学了，虽然你的学习路线标明2选1学习即可，但我还是很迷茫，求黑马大大解答

【回复】动画，响应式布局，移动端开发，已在录制中，pink老师那套版本会旧一些。看这套新版的即可，里边的项目案例都是更新的。
【回复】回复 @12346685了 :https://www.bilibili.com/video/BV1xq4y1q7jZ
【回复】回复 @小张啥都会x :我不会的问你可以不[脱单doge]
JERRY瑞瑞瑞瑞:
花了整整半年的时间细致认真的学习完了老师的 HTML CSS 教程，受益匪浅！ 我总结整理了一份包含该视频课程 全部知识点 近10万字 的 Markdown 笔记！笔记中包含所有的知识点归纳！并且配套有视频中对应的代码案例，最重要的是：每个代码案例都配套对应的效果图及批注，而且对于动画等页面效果所配套的都是GIF动态图片！！！，而且文档经过了精美的排版，同时加入了许多重要的知识点补充，更NB的是所有知识点都配套对应的思维导图！！！ 整理这份资料花了我半年所有的业余时间！！！如果只看视频，不做记录的话，效率非常低，看完就忘了！希望我提供的这份资料能帮助到大家！！！感谢！！！ Markdown文档：https://github.com/JERRY-Z-J-R/I-love-you-3-thousand/tree/master/我爱你，不止三千遍/HTML CSS 思维导图：https://github.com/JERRY-Z-J-R/mind 制作不易，希望大家可以去GitHub收藏一下！这对我有非常大的帮助！感谢大家！

零点分享:
学不进去，去看看隔壁大猛子，就学的进去咯

泥灸1:
打卡 day 1 学习内容 p1 -——p14 二、 HTML标签学习 2.1、排版标签 1、标题标签 1．标题标签有<h1>--<h6> 2．特点：文字加粗、文字变大，h1-h6逐渐减小、独占一行 2、段落标签 1．段落标签<p></p> 2．特点段落之间存在间隙、独占一行。 3、换行标签 1.代码<br> 2.特点：单标签、让文字强制换行。 4、水平线标签 1．代码<hr> 2．特点：单标签、在页面中显示一条水平线。 2.2、文本格式化标签 1、文本格式化标签的介绍 场景：需要让文字加粗、下划线、倾斜、删除线等效果 代码：加粗b 、strong 下划线：u 、ins 倾斜：i 、 em 删除线：s 、del 语义：突出重要性强化语境 2.3、媒体标签 1、图片标签 1．代码：<img src=” ” alt=” ”> 2．特点：单标签 Img标签需要展示对应效果，需要借助标签属性进行设置！ 注意：标签的属性写在开始标签内部 标签上 可以存在多个属性 属性之间以空格隔开 标签名与属性之间必须以空格隔开 属性之间没有顺序之分 3．图片标签的alt属性 属性名：alt 属性值：替换文本 图片加载失败，显示alt的文本，反之则不显示 4．图片标签的title属性 属性名：title 属性值：提示文本 当鼠标悬停时，才显示文本 注意:title属性不仅仅可以用于图片标签，还可以用于其他标签。 5．图片标签的width和height 属性名：width和height 属性值：宽度和高度（数字） 注意点： 如果只设置width或height中的一个，另一个没设置会自动等比例缩放 （此时图片不会变形） 如果同时设置了width和height两个，如设置不当图片可能会变形。 心得：前端很有趣 ，加油啊！！

【回复】前端真得很有趣，边写边看效果，很容易有成就感。
【回复】回复 @黑马刘同学 :到后面就难受了
【回复】我用的md文件存笔记，现在有好多了
可以叫我刘同学:
立个 Flag：200集 一周刷完（2021-11-24）→ 刷视频 + 敲代码 + 记笔记。 第1天打卡，一口气看了 P1~P8 给自己加个🍗😄😄 美女老师讲得很详细，爱了爱了~~~ 讲课不拖沓，干净利落，比一些磨磨唧唧的好多了~~~

【回复】回复 @DrewhouseJB :还没有 [笑哭]，Flag 不能乱立
【回复】进厂了吗，好兄弟[doge][脱单doge]
你今天和可乐了吗:
年末21天前端打卡DAY10学习小节数p98-p111 2021.12.12 学习笔记： 1，盒子模型 布局顺序：从外往内，从上往下（从外往内，先宽高背景色，调解内容的位置，控制文字细节） 2，内边距 padding属性可以当做复合属性使用，表示单独设置某的方向的内边距 padding ：最多跟4个值（上右下左） 3,c3的盒子模型 好处：加了border和padding不需要动手减法 box-sizing：border-box 4，外边距 外边距和内边距一样 5，版心居中 版心：网页的有效内容 margin：0 auto 去掉列表的符号（list-style：none） 6，外边距折叠现象 垂直布局和块级元素，上下的margin会合并 结果：最终两者距离为margin的最大值 方法：只给其中一个盒子设置margin 7，5.8外边距折叠现象-②塌陷现象 场景：互相嵌套的块级元素，子元素的margin- top会作用在父元素上 结果:导致父元素起往下移动 解决方法: 1.给父元素设置border-top 或者padding-top (分隔父子元素的margin top) 2.给父元素设置overflow: hidden 3. 转换成行内块元素 4. 设置浮动 8，如果想要通过margin或padding改变行内标签的垂直位置，无法实现 行内标签的margin-top和bottom 不生效 行内标签的padding-top和bottom 不生效 学习心得：今天是我学习的第十天，加油继续努力！

【回复】大佬们，我想问个问题。为什么我用pxcook 测出来的像素和颜色和老师测出来的不一样啊[tv_难过]是我系统的问题，macos系统，还是我截图软件的问题
【回复】前端23期-day2-p12-p21 学习了在网页中显示图片，属性之间要用空格隔开 alt 替换文本 title 提示文本 相对路径 绝对路径 学习心得：这是学习的第二天，继续努力
【回复】回复 @nightmare啦啦 :加练习应该五六个小时吧，我的速度慢
死神_永生:
啊这，我pink老师的css和js快看完了，突然看见这个

【回复】不知道这个和pink那个好些，这个短又新
【回复】回复 @BZ祥子 : 哪个好点？
【回复】回复 @重邮jt-U87 :没什么区别的，这几个都不怎么难，就js要学好，重点是后面的框架跟nodejs之类的
uaena-尘:
前端第19期打卡day1 学习内容：P1-13 学习笔记： 1.网页基本由HTML、CSS、JavaScript组成，分别代表网页的结构、表现、行为。 2.网页是运行在浏览器上的，常用的浏览器有谷歌、火狐、safari等，推荐谷歌。 3.编写网页代码一般用VScode进行，我已经学会基本使用了 4.HTML骨架可以由elemeet语法生成，打个叹号就有了 5.注释快捷键按ctrl+/ 6.标签分为单标签和双标签，一般都是双标签，标签一般嵌套使用 7.常用的标签有h1到h6，段落标签p 8.加粗标签：b/strong ; 下划线标签: u / ins ; 倾斜标签: i / em ; 删除线标签：s / dei 9.图片标签:结构：<img src="图片地址" alt="替换文本"> 学习心得：对网页有了基本的认识与了解，今天学习的基础知识感觉不错，再接再厉！

【回复】回复 @黑马程序员 : 老师，可以求一份资料吗，已三连支持！
xxxYasso:
【年末21天前端打卡DAY3 p15到p20】 学习笔记： 1.相对路径：从当前文件开始出发找目标文件 2.相对路径分类： 同级目录：当前文件和目标文件在一个目录中 下级目录：目标文件在下级目录中 上级目录的写法是：../ 可以直接写目标文件 3.加入音频用audil 但是一些浏览器不支持自动播放 要在src值后面 加controls autoplay为自动播放但是部分浏览器不支持自动播放 loop为循环播放 以上的都加在音频后面 4.音频标签目前支持3种格式：MP3,Wav，Ogg 5.video表示视频标签 6.video也要加入controls播放控件 7.autoplay后面可以加muted静音自动播放 8.链接标签为<a href="./目标网页.html">超链接</a> #为空链接 href的作用是跳转地址 target=属性表示调整： _self默认值，在当前窗口中跳转（覆盖原网页） _blank在新网页跳转 学习心得：今天学习了html的各种标签的用法，今天是day3，希望我可以继续学下去

服了你了老六了:
年末21天前端打卡DAY4学习小节数p81-91集 显示模式，行内块(input textare button select img……) 显示模式 转换(元素显示模式选错使用) 标签嵌套 HTML嵌套规范注意点 1.块级元素一般作为大容器，可以嵌套：文本、块级元素】行内元素】行内块元素等等…… 但是，p标签中不要嵌套div、p、h等块元素 2、a标签内部可以嵌套任意元素 但是：a标签不能嵌套a标签 继承性 层叠性 综合案例1 综合案例2 优先级-基本测试1、！important写在属性值的后面，分号的前面！ 2、！important不能提升继承的优先级，只要是继承优先级最低 3、实际开发中不建议使用！important优先级-叠加运算 优先级-计算题 谷歌-排错 心得：通过这几天的学习，感觉越来余额有成就感了[呲牙]

復行數十步:
打卡day1 学习内容p1-10 关于html： Html是超文本标记语言，是用来描述 web文档的一种标记语言。使用标签作为页面的开始和结束部分。html通常被称为静态网页。HTML是带html或Htm扩展名的文件。 HTML的一些标签代码规则将内容呈现在浏览器中所需的风格。HTML可以使用记事本创建，并以.html或.htm为扩展名保存。Html文件中的代码包含一些规则、规则、标签和内容。形成具有指定的html结构和内容的完整的HTML文件。 可以直接用浏览器打开它来查看网页的效果。 若要在浏览器中显示各种网页，则需要 html文件(HTML基本结构+内容+标签)和 css文件(css风格)才能实现所需的漂亮网页。 今事情忙，匆匆看完html基础章，学校是开了这门专业课的，复习起来毫无压力，明天我要认真学习了！[给心心]

男人都是大猪蹄子吗:
翻来覆去就是这些玩意儿，去看早期pink老师都看完就行了。

【回复】这套的采用实战式教学，配备取自一线大厂的综合案例，用最短的路径讲解每个技术点。你不会失望的哈。
【回复】回复 @黑马程序员 :反正基础内容就都是那些，你要说案例不一样更好，那单学一下案例就好了。
【回复】回复 @破名改半天 :是不是女神我不知道，我也不在乎，我只要他讲的让我舒服，包括语调啊，教学的逻辑啊之类的。
你今天和可乐了吗:
年末21天前端打卡DAY4学习小节数p31-p40 2021.12.6 学习笔记： 1，input标签 text 文本框输入，显示文本内容 password 密码框输入，不显示文本内容 radio 单选框，用于多选一 （ 编辑name值：分组，有相同name属性值的单选框一组，一组中同时只能有一个被选中；加入checked为默认选择） checkbox 多选框，用于多选多 同样可加checked file 文件选择，用于上传文件 （multiple属性：上传多个文件， 2，placeholder placeholder：占位符，提示用户输入内容的文本 3，input系列标签 type标签属性值有:1,submit，提交按钮，点击之后提交数据给后端服务器 2,reset，重置按钮，点击之后恢复表单默认值 3,button，普通按钮，默认无功能，之后配合js添加功能<intput type="button" value="普通按钮"> 4，button按钮标签（谷歌浏览器中button默认是提交按钮） 5，select下拉菜单标签 select标签：下拉菜单的整体（selected为下拉菜单的默认选中）（父级） option为下拉菜单的每一项，（子级） 6，textarea文本域标签 textarea属性 ：1：cols：规定文本域内可见宽度；2：rows：规定了文本域内可见行数 7，label标签 使用方法1：1，用label标签把内容（如：文本）包裹起来；2，在表单标签上添加id属性；3，在label标签的for属性中设置对应的id属性值 使用方法2：1，直接使用label标签把内容（如：文本）和表单标签一起包裹起来,2，,需要把label标签的for属性删去 学习心得：今天是我学习的第四天，加油继续努力！

黑马程序员:
全套配套资料教程，关注微信公众号：黑马程序员，回复：领取资源02 学习交流q群: 771758597 2022版前端最新最全学习路线图 cv10431130 资源下载问题 cv11763184 web 入门 Html5+css：BV1Kg411T7t9 web 进阶：BV1xq4y1q7jZ 技术进阶 JavaScript：BV1ux411d75J DOM BOM：BV1k4411w7sV jQuery：BV1a4411w7Gx Ajax：BV1zs411h74a Vue 开发 Node.js: BV1a34y167AZ Vue2+Vue3全套：BV1zq4y1p7ga React &小程序开发 React：BV1gh411U7JD 零基础玩转微信小程序：BV1834y1676P 教程学习可能遇到的问题答疑（非技术型）：cv7964085

【回复】回复 @易建联颜粉 : 新版本的vscode更新了，自动生成html模板的快捷键是输入html，弹出html：5，选择那一个就可以生成html模板代码了
【回复】回复 @我有崽崽奶糖 : 我我我 我要加入还可以吗