前端学习自学笔记:day01

在这里要跟大家说声抱歉,本人拖更太久啦.现在在自学前端,我每天会把自己的总结笔记发上来分享给大家,希望对大家有帮助.

在此之前先为大家显示下前端工程师的路线图:

第一天的笔记:HTML AND CSS

早上学习知识:

1.注册freeCodeCamp&GitHub

2.freeCodeCanp基本操作

3.代表一个HTML元素,h1是一级标题。

h2,3,4....代表2,3,4。。。。级标题

注释:浏览器会自动地在标题的前后添加空行。

注释:默认情况下,HTML 会自动地在块级元素前后添加一个额外的空行,比如段落、标题元素前后。

4.p是段落,格式为

.

注释:浏览器会自动地在段落的前后添加空行。

不能忘记结束标签。

5.注释 注释:开始括号之后(左边的括号)需要紧跟一个叹号,结束括号之前(右边的括号)不需要。

6.lorem ipsum text 占位符

7.style 样式 (以inline style(内联样式)为例)

颜色属性 color 例:CatPhotoApp

字号属性 font-size 例:

字体属性 font-family 例:

8.元素选择器

例:

.blue-text {

color: blue;

}

元素上应用:

CatPhotoApp

中午补充的知识点:

之间的文本描述网页

之间的文本是可见的页面内容

HTML链接是通过标签进行定义的。

1.使用新窗口打开链接 target="_blank"

HTML图像是通过标签进行定义的。

例:

HTML元素语法

- HTML元素以开始标签起始

- HTML元素以结束标签终止

- 元素的内容是开始标签与结束标签之间的内容

- 某些HTML元素具有空内容

- 空元素在开始标签中进行关闭

- 大多数HTML元素可拥有属性

注意:大多数HTML元素可以嵌套(可以包含其他HTML元素)

例:

This is my first paragraph.

空的HTML元素

没有内容的HTML元素被称为空元素。空元素是在开始标签中关闭的。

例:

HTML建议使用小写标签。

HTML属性

HTML标签可以拥有属性。

属性总是以名称/值对的形式出现并且在开始标签中规定的。

例:

这是一个例子

属性例子:

对齐标题

为标题添加背景颜色

HTML建议使用小写属性值。

HTML必须为属性值添加双引号。

HTML水平线

标签在HTML页面中创建水平线。(可用于分割内容)

例:

This is a paragraph

This is a paragraph

如何查看其他网页的源代码

单击右键,然后选择“查看源文件”(IE)或“查看页面源代码”(Firefox),

其他浏览器的做法也是类似的。这么做会打开一个包含页面 HTML 代码的窗口。

HTML拆行(换行)

例:

This is

a para

graph with line breaks

注意:当显示页面时,浏览器会重新排版,会自动忽略掉多余的空格和空行,所以

多余的空行和空格会被认为是一个空格。

字体加粗:

例: www.DIVCSS5.com

  • 发表于:
  • 原文链接:http://kuaibao.qq.com/s/20171221G0DP3800?refer=cp_1026

扫码关注云+社区