[0406]学习一个——利

前言


  • 最近发现了Github的Student认证,本来想用来注册Digital Ocean搭个梯子,结果注册验证不能用VISA借记卡=~=。
  • 那么在这漫长的清明节假期里,只有学习能满足空虚的内心(划掉),疲劳刷完了,只有学习一个!
  • thinkful提供了HTML/CSS, JavaScript入门教程,Github说是一月,但thinkful发的邮件里只有2周。。就三个单元,应该能学完吧(望天)。

1. Unit 1 Html CSS 与 版本控制


1.1 网页基础

1.1.1 使用CodePen展现网页内容

  • 演示一个牛逼的CSS效果
  • 介绍了(避免中文语义上的误差,直接复制)
    • h1 - A first level heading tag. Normally there’s only one of these on a page, and it’s used to indicate the most important header.
    • h2 - A second level heading tag. This is used for headers that are less important than h1. HTML gives us h1 to h6. From h2 on, it’s fine to use more than one on a page. Note that these heading tags help Google’s web crawlers understand what a page is about, and therefore are crucial for SEO (search engine optimization). They also set default styling for any text they wrap (so an H1, for instance, will have bigger, bolder font than a paragraph, by default in all modern browsers).
    • p - The paragraph tag, which you’ll be shocked to learn is used to indicate that a grouping of text is a paragraph.
    • ul - The unordered list tag is used in conjunction with the li tag to represent un-numbered, bulleted lists of items.
    • li - Used to indicate a list item in a ul.
    • a - The anchor tag, which is used to link to another part of the page, or another page entirely.
    • div - The div tag, which is a generic container element, used to group together content.
  • 然后用这些姿势写个Hello World哦不About Me,这是我的成果
  • 建议时间1小时,我怎么10分钟就看完了呢= =
  • 垃圾Markdown直接用标签会出现奇怪的显示

1.1.2 Sublime Text与Project框架基础

  • profession建议使用Word或者Google Docs来写Code,但作为初学者,建议使用IDE-Sublime Text 3 Coding,顺便推销一下花70美元买Sublime Text 3非常划算
  • 本节主要学习
    • Html和CSS文件的转换
    • 如何使project目录结构化
    • 新的HTML标签
      • !DOCTYPE html: Strictly speaking, this is not a tag, but rather a command to the browser to parse the page as HTML5, which is the most recent version of HTML. We‘ll learn more about HTML5 later in this unit.
      • html: The html element is bounded by opening and closing html tags. We say that the HTML element is the root element and all other HTML elements are children of this element, meaning they’re contained within the HTML tags.
      • head: The head element contains metadata about the HTML document. By default, we get + title inside the head (discussed next). There are numerous children types that can appear in the head. If you take a look at head elements out in the wild, you‘ll often find metadata related to SEO (search engine optimization), Facebook sharing, or definition of document wide variables going on in document heads. For now though, just remember that the head element is where we put document metadata.
      • title: Web browsers display the text in the title element in the browser tab. Web crawlers also look to this element to help classify web pages, so it plays an important part in SEO.
      • body: Body tags are used to delineate the main displayable elements of a web page.
    • 如何将CSS链接到HTML文件上
    • 如何预览网页
    • 所以春节套天下无敌!
      <!DOCTYPE html>
      <html>
      <head>
      <title>春节套天下无敌</title>
      <link rel="stylesheet" type="text/css" href="main.css">
      </head>
      <body>
      <p>foo <a href="http://dnf.qq.com">bar</a></p>
      </body>
      </html>
    • CSS
      p{
      color:red;
      }

    • IDE生产环境还蛮舒服的


1.1.3 挑战:Move Your "About Me" to Standard HTML and CSS Files

  • そうだね!簡単な問題が!
  • 这个IDE的Tab补足实在是太厉害了!

1.1.4 小结

  • 学习使用了CodePen和Sublime Text,学习了HTML和CSS的基础,给了我有能力学习这些技能并且创造优秀产品的信心
  • 学习了必要的HTML标签并且如何去创造一个简单网站的目录。
  • 对以下步骤很有信心:
    • 建立HTML和CSS文件,并将一个CSS文件链接到HTML文件中
    • 创建project目录
    • 创建CodePens
    • 使用IDE
    • 使用HTML+TAB输入所有HTML需要的代码

1.1.5 参考教程

原文地址:https://www.cnblogs.com/shy-/p/8727805.html

时间: 2024-11-09 04:40:19

[0406]学习一个——利的相关文章

关于如何学习一个框架的经验总结

1.怎么学习一个框架? 我认为有三个维度来说明:这个框架是为了解决什么问题而诞生的?这个框架的核心思想是什么?这个框架适合应用到哪些场景? 说到思想,我觉得编程的灵魂就是思想,没有思想的编程和咸鱼没什么区别,这里我六年来血与泪的总结 2.不要被框架拉着走,要做框架的主人 我发现我身边好多人都深陷于框架之中,包括我自己有一段时间也深陷其中(还好现在走出来了),都关注在这个框架怎么用,哪个牛X,熟不知还没等你熟练怎么用时,又一个新的框架出来,那时你又得学,一来二去你就被框架拉着走了 我觉得当你了解上

分分钟教你学习一个新的框架--Photos FrameWork

相关链接:ios-深度解析二维码的生成与使用 swfit项目初体验Photo-Browser 一.点击查看大图 1.点击图片或按钮(点击查看大图按钮),modal出来一个控制器,显示大图片 2.怎么处理能让点击图片就能查看大图? 两种方法:1.给图片添加点按手势 2.给图片所在的view上添加 - (void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event 2.1 添加点按手势 优点:适用于任何场景下,不受

N天学习一个Linux命令之帮助命令:man

前言 工作中每天都在使用常用的命令和非常用的命令,忘记了用法或者参数,都会bing一下,然后如此循环.一直没有真正的系统的深入的去了解命令的用法,我决定打破它.以前看到有人,每天学习一个linux命令,我现在没有这么充足时间,我恐怕一周学习一个linux命令我都做不到,想想我还是N天学习一个linux命令吧,从现在开始算起. 用途 显示命令帮助文档以及用法 用法 man [options] [section] cmd 命令文档部分说明 The table below shows the sect

学习一个项目权限的心得

最近主管要求我研究公司项目的权限管理,到现在都一周了,我还是没有搞清楚.用到了哪些基本都懂,也做过些小测试,但是真正到了看项目中的权限,我还是一个头两个大了.每天下班都是因为脑袋太胀了,然后就没有然后了,总的来说:学习一个技术确实不是那么容易,了解.会用.精通是完全不同的.做过demo和在项目中实际应用也是有很大区别,所以学个东西还是任重道远. 下面说说我的学习过程: 一开始,我是通过实体来来先分析数据库设计的.实体中字段和数据库对应字段弄的特别乱,而且项目中没有明确的持久化配置和注解关联.有关

linux学习一个服务(未完)

学习一个服务的过程 1.了解服务的作用:名字 功能,特点 2.安装 3.配置文件位置,端口 4.服务启动关闭的脚本 5.此服务的使用方法 6.修改配置文件,实战举例 7.排错(从下到上,从内到外) 原文地址:https://www.cnblogs.com/fps2tao/p/8542847.html

你应该如何学习一个未知的技术领域?- 菜鸟小白篇

一.前言2018年初开始从事线上课程的开发,陆续开发了几门课程,<人工智能产品经理最佳实践请添加链接描述><知识图谱实战开发完全剖析请添加链接描述>和<智能对话机器人实战开发完全剖析>,其中每一个专题都是自己对于这个新兴领域的探索和实践经验的总结.课程制作的过程,同时也是一个学习和反复思考.再学习的过程.有着近20年的一线IT行业技术.产品研发.设计经验的沉淀,尤其是方法论方面总结和沉淀,对于自己快速掌握新兴领域的知识,起到了至关重要的作用:通过提供面向学员的咨询和答疑

每天学习一个LINUX命令:ls 目录列表(list 清单目录 名单)

ls命令用于显示文件目录列表.当不加参数时,默认列出当前目录的列表信息. 语法参数: ls [参数] [目录或文件名] 参数(注意区分大小写) -a:显示所有档案及目录(ls内定将档案名或目录名称为"."的视为影藏,不会列出):-A:显示除影藏文件"."和".."以外的所有文件列表:-C:多列显示输出结果.这是默认选项:-l :与"-C"选项功能相反,所有输出信息用单列格式输出,不输出为多列:-b:将文件中的不可输出的字符以反

C语言学习一个月后感想

C语言学习一个月后感想 感谢李晓东老板及计算机工程师联盟的学长学姐和某神秘同级同学的辛勤指导,感谢宋雨田的督促和陪伴. 初识C的1..体会 我本以为凭借瓜皮思维和花里胡哨操作可以让我熟练地学习语言,现在发现只是python的易入门给我的错觉...错用列表赋值带来的稀奇古怪的初始值,scanf中百度已经无法解决的错误,时不时崩溃的codeblock,我永远无法知道到底在那里出错的oj(wa,时间溢出,数据溢出,编译错误)······好吧我知道这不是问题.(??へ??╬) 但愿吧. 我是贝尔格里尔斯

每天学习一个小功能:java文件上传

====(1.)第一种.利用普通缓冲流进行文件上传 ① 前端 注意: 1.指定表单类型为文件上传表单 :enctype="multipart/form-data"  2.提交方式必须为:post3.表单中,存在文件域 的表单元素 <form name="frm_test" action="${pageContext.request.contextPath }/shangchuan" method="post" encty