HTML / CSS

今天我们来聊聊如何用HTML和CSS

养网站防老第0步：如果你没有编程基础，如果你不会前端开发，那么推荐跟着这个免费视频教程学习

原创 我是哥飞 哥飞

大家好，我是哥飞。我们的养网站防老系列已经连载了11篇文章了：

  1. 养网站防老：网站可以做成一生的事业
  2. 养网站防老第1步，挖掘出第1个需求
  3. 养网站防老第1.5步：用一个公式来判断关键词是否值得做，让你选择关键词不再犹豫
  4. 养网站防老第2步：分析搜索意图
  5. 养网站防老第3步：根据搜索意图使用ChatGPT的GPT4生成网页
  6. 养网站防老第4步：手动调整布局和样式
  7. 养网站防老第5步：内页和内链建设
  8. 【6000字详解】养网站防老第6步：利用ChatGPT给网站增加多语言支持
  9. 养网站防老第7步：注册域名，解析域名，部署上线
  10. 养网站防老第8步：添加统计代码，提交到 Google Search Console，增加外链，等待被收录
  11. 养网站防老第9步：谷歌对于AI生成内容的态度及如何让AI生成高质量内容

时不时 有朋友问哥飞，没有 基础 可以养网站防老，做网站赚美元吗 ？
所以今天哥飞增加一个第0步，教你怎么去自学前端开发入门。
哥飞很推荐所有没有前端基础或者没有编程基础的朋友学习B站的这个前端入门视频教程：成为网页设计师的第一步！快速上手HTML&CSS展开你的网页设计之旅！

HTML/ CSS

今天我们来聊聊如何用HTML和CSS

这是一个很好的前端入门教程，最好的地方是，他只讲用 HTML 和 CSS 来制作网页，没有一上来就让你学 Vue 或者 React 。
而哥飞讲的做出海工具网站赚美元，其实大多数时候，有了 HTML 和 CSS，再配合一点原生 JS 知识就可以了。
所以，这是一个很适合大家入门学习前端的视频课程。

看看大纲，全是干货，没有废话：

� 内容纲要
00:00 开场白
01:19 建立 HTML 文件结构
02:50 HTML 常用标签
06:54 如何用 CSS 修改样式
09:29 HTML5 语义标签（Semantic Elements）
10:28 CSS 盒子模型 (Box Model)
14:08 CSS Position 布局
16:12 CSS Class 选择器
17:42 CSS Flexbox 布局
22:38 HTML 表单设计
24:31 使用 CSS 固定导航栏
25:22 CSS 响应式设计 (Responsive Design)

https://www.bilibili.com/video/BV1Wr4y1R7Bd/

B站有个评论说“ 三十分钟讲了我们老师一学期讲的 ”，从这就可以看出这个视频的含金量了。

那么你要怎么学呢？

视频很短，只有28.5分钟，所以第一遍，你只需要跟着看，不要动手操作，就看，看完了，你就对整体有了一个大概的了解。
视频里写代码用的是 VSCode ，电脑是 MacOS 系统，你的电脑如果是 Windows 系统，一些操作可能会有点不太一样，但没关系，不一定要严格的按照他的操作一步一步做，你先理解他的操作目的是什么，然后你在你的电脑里做到同样的目的就行。
第一遍看完了之后，你就去下载 VS Co de ，如果你下载不到，也没关系，直接用电脑自带的任何一个能够纯文本编辑器就行，如记事本，只要别用 Word ，都没问题。
哥飞觉得学前端最好的地方就是，你完全不用任何别的软件，就用 Windows 自带的记事本和浏览器就可以开始学，入门门槛极低。
如果你的电脑没有谷歌浏览器也没关系，有什么浏览器就用什么。
总之，不要把时间浪费在安装教程里的一模一样的软件上。
第二遍，你就可以跟着视频开始一步一步做了，任何搞不懂不知道怎么做的地方，可以去百度，可以去问ChatGPT，直到搞懂为止。
总之，不要遇到一点困难，你就放弃。
如果你利用工作之余的时间来学习，那么2周的时间是足够学完的。
2周之后，你就可以自己徒手写前端网页了。
然后你就可以开始学原生 JS 知识了，这个时候，你就没必要去跟着视频学习了，直接打开 MDN ，了解一下 JS 是什么，能干什么，把快速入门学完。
网址： https://developer.mozilla.org/zh-CN/docs/Web/JavaScript 。

Inthis article

/mdnwebdocsReferencesGuides PlusBlogPlayAl Help
Web开发技术>JavaScript
Filter
JavaScriptJavaScript
教程JavaScript（JS）是一种具有函数优先特性的轻量级、解释型或者说即时编译型c的编程语言。虽然作为
快速入门Web页面中的脚本语言被人所熟知，但是它也被用到了很多非浏览器环境中，例如Nodejs、Apache
JavaScript基础知识并且支持面向对象、命令式和声明式（如函数式编程）风格。CouchDB、AdobeAcrobat等。进一步说，JavaScript是一种基于原型、多范式、单线程的动态语言，
JavaScript第一步
创建JavaScript代码块JavaScript的动态特性包括运行时对象的构造、变量参数列表、函数变量、动态脚本创建（通过eval）、
介绍JavaScript对象对象内枚举（通过for..in和Qbject_工具方法）和源代码恢复（JavaScript函数会存储其源代码文本，
JavaScript指南可以使用toStringl进行检索）。
介绍本部分文档将专注于JavaScript语言本身，而非局限于网页或其他运行环境。想要了解网页中特有的API，
语法和数据类型请参考WebAPI以及DOM。
流程控制与错误处理ECMAScript语言规范（ECMAScriptLanguageSpecification）（ECMA-262）和ECMAScript国际化
循环与选代API规范（ECMAScriptInternationalizationAPIspecification）（ECMA-402）是Javascript的标准。
函数当某个ECMAScript新特性的提案口已经被一些浏览器实现时，MDN上的文档或示例就可能会涉及到这些新
表达式与运算符间。特性。大多数时候，处在stages3和4的新特性会被收录到文档中，且收录时间通常早于其正式发布的时
数字和日期
文本格式化不要将JavaScript与Java编程语言口混淆—JavaScript不是“解释型Java"。虽然"Java"和
正则表达式用途方面有相当大的不同。"JavaScript"都是Oracle公司在美国和其他国家注册（或未注册）的商标，但是这两门语言在语法、语义与
索引集合类
带键的集合JavaScript的核心语言特性（大部分是纯ECMAScript）的文档包括以下内容：
使用对象·JavaScript指南
使用类·JavaScript参考
使用Promise有关JavaScript规范和相关技术的更多信息，请参阅JavaScript技术概述。
JavaScript类型化数组
选代器和生成器想成为一名前端网页开发人员吗？
元编程
为了帮助你实现这个目标，我们总结了一条包含所有必要信息的学习路线。
JavaScript模块
从这里起步
中级教程

再下一步，你就没必要把 JS 所有知识学完了，你把 MDN 当作手册，去翻你网页里某个按钮点击之后，假如要获取某个输入框的值，然后在网页的另一个地方显示出来，要怎么做。也就是去学习 JS 事件的用法。

学会这个就足够了，然后你就可以去做一个在线闹钟网页工具，需求是网页里有一个时间选择框，可以选择未来2小时内的某个时间点，然后点击确定按钮，网页开始倒计时，每秒变动一次，到了0秒，网页播放一段音乐。

能做出这么一个可交互的网页，并且布局合理的话，你就算前端入门了。

后面需要用到什么，再去学什么就行。

至于要不要去学 Vue ，建议你先用原生的 HT $A L+C S S+J S$ 做几个网站再说。
至少做了3个网站后，你就会发现，有一些原生代码不太方便的地方，那么可以再去学习 jQuery 或者 Vue 。
一定记住，我们目的是做网站赚钱，不是学前端去找前端开发工作，所以用到什么学什么就行，只要能够实现网页功能就行，没必要一定追求用 Vue 。
因为你一旦接触了 Vue ，你就会掉入一个大坑，需要学习的知识增加N倍。
花费在学习的时间会增加N倍，极容易半途而废。
月入25万美元的 Levels 还在用 PHP+jQuery ，但是一点也不妨碍他做的网站赚钱。
好了，今天的文章就到这里了。

哥飞在《 养网站防老：网站可以做成一生的事业 》说过：

6、做网站就像是种树一样，先种下第一棵树，再种下第二棵树，慢慢你就有了一个小果园，收成会越来越好；
7、尽量多种几种不同品种的果树，既可以使得一年四季都有水果吃，又可以防止“病虫害”导致同种果树死亡；
8、网站可以做成一生的事业，只要碳基生命还存在，就还会有网站的需求，我们就还能靠网站来赚钱；
9、养儿防老不如养网站防老。

我是哥飞，公众号：哥飞养网站防老：网站可以做成一生的事业

哥飞也给大家说了《 2023年了，为什么还要做网站？为的是可控的流量，可控的用户，可控的收入。 》
哥飞的社群就是围绕着“养网站防老”话题，带着大家一起做网站赚钱，让每一位朋友都能够慢慢有一个自己的小果园。
目前社群分为两个微信群，一群已经有469位朋友了，也就是只剩31个位置了，目前价格888元。二群已经满了100人，目前价格涨价到555元。这是一个什么社群呢？是一个执行力十足，不断有报喜的好消息传来的社群。

入群100天，哥飞的朋友们手握百万流量，支付订单滚滚来社群朋友9月份新上的网站从谷歌获得了1万个点击。恭喜群友做了个网站上线21天拿到10万日PV，又花了13天变成了20万日PV群友新站上线9天拿到11030个独立访客，他是怎么做到的？

社群目前暂时是微信群形态，有一个配套的网站，已上线第一版，社群内朋友可见。
社群主要面向技术开发者、产品经理、设计师等人群，大家一起讨论独立开发、出海产品、流量获取、流量变现等话题。
社群讨论的话题主要是围绕着网站来的，用网站来承接流量，然后变现。
那么就要考虑做什么网站，所以需要去挖掘需求。
然后去搞流量，可以是SEO，也可以是发帖宣传推广，还可以是付费软文。有了流量之后就得考虑如何变现，可以是广告变现，也可以是联盟导购，更可以直接向用户收费。
社群从加入日期开始计时，365天后到期。
群里讨论很活跃，行动很迅速，大家已经做了几十个产品了。
这个社群7月2号开始运营的，到今天3个多月时间里，主要讨论了以下话题：1、建站基础，如何快速做一个网站；
2、SEO基础，如何优化网站；
3、推广基础，如何宣传推广网站；
4、运营基础，如何运营好一个网站；
5、Adsense基础，如何靠谷歌Adsense赚广告费；
6、一些工具使用经验分享，如Semrush分析别的网站流量和出入站链接，Similarweb如何看流量；
7、基于Semrush、Similarweb等工具，如何去发掘新需求，发现新网站；
8、实战经验，如何去抓住新词热词做网站，从搜索引擎获取流量。
以及其他更多相关话题，欢迎加哥飞微信 GeFeiSvip 加入社群大家一起出海赚钱，养网站防老。

Console.log0