web 学习+静态网页设计

HTML、CSS和JavaScript。html是内容，css是表现，javascript是行为。前端开发的门槛其实非常低，与服务器端语言先慢后

WEB前端分：高级，中级，初级。

初级前端掌握的课程：

HTMl5+ CSS3。

前端学习的基础技能需要掌握HTMl+ CSS的基础内容。

学习内容：基础标签div，span，p，ul，li，input等。

CSS：语法、派生选择器、id选择器、类选择器、属性选择器。

CSS基本样式：背景，字体、链接、列表、表格、轮廓。

CSS盒子,CSS选择器,CSS常用操作。

中级前端掌握的课程：

CSS3和动画效果。

HTML5。

新增标签、浏览器适配。

JS——基础。

实现、输出、语法与注释、变量和数据类型、javaScript函数、JavaScript异常处理和事件。

件处理、DOM对象、正则表达式等。

重点掌握：Jquery、angularJS、bootstrap。

高级前端掌握的课程：

移动端：nodejs，vuejs。

CSS：面向对象的CSS、CSS的后处理、Less、SASS。

JavaScript：模块化，数据推送、高级函数、面向切面、多线程、设计模式。

---

2018.11.30

    今天正式开始了web学习（前两天一直在调试编译器）。

    还是从基础的学起，先通过做一些笔记，笔记本没有带。

    HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。

    CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。

    JavaScript是用来实现网页上的特效效果。如：鼠标滑过弹出下拉菜单。或鼠标滑过表格的背景颜色改变。还有焦点新闻（新闻图片）的轮换。可以这么理解，有动画的，有交互的一般都是用JavaScript来实现的。

    1.

就是标题标签 通过向两者之间输入文字作为标题

    2.

是段落标签

    3.img标签来完成的，它在网页上的代码写成

    4.称为根标签，所有的网页标签都在中。

    5. 标签用于定义文档的头部，它是所有头部元素的容器。（通常包含标题信息，元数据，脚本代码等）

    文档的头部描述了文档的各种属性和信息，包括文档的标题等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

    下面这些标签可用在 head 部分：

 

   

   

   

   

   

 

b.定义元数据

MATE元数据 用来描述 HTML的信息 使用元素来提供页面的元信息，如网页的关键字，作者信息，网页过期时间。

位于文档的头部，它定义的信息不会出现在网页中，仅在源文件中显示。

一个HTML文档的头部可以有多个标记，

常用元数据：

charset 字符集 定义网页使用的字符集

搜索引擎关键字

将mate元素的name属性的属性值设置为keyworks，就可以想搜索引擎说明网页的关键字

设置网页定时跳转

当标记的http-equiv属性值设置为refresh时，就可以设置页面在经过一定时间后自动刷新，或者在一定时间后自动跳转到其他页面。页面定时刷新或跳转的基本语法格式：

语法中，"[url="资源路径"]"是可选项，如果有此项对应的网址或者路径，则页面定时跳转；否则定时刷新

---

2018.12.5

HTML的主体

1.添加文字

可以正常向body中添加文字，而其中控制空格的方式有所不同通过 来控制空格，几个空格就输入几个 。

2.添加特殊符号

常用特殊符号

   3.代码注释。

4.换行控制符

5.段落是

在开始标记和结束标记之间形成一个段落。p元素会自动在其前后创建一些空白，浏览器会自动在段落间添加这些空间。

6.

---

水平线 

7.标题文字由

->

(1-6字号由大到小，同样是双标记)

8.强调文本

强调粗体文本

强调斜体文本

9.插入，删除（个人感觉没有任何卵用）

插入的文本(就是加一个下划线）

删除的文本(就是这样)

10.小型文本 小角标（标签 商标等）

---

2018.12.6

1.上下标（如平方）

_下表文本

^上标文本

2.注音文本（显示在文字上方 如：拼音）

rp元素定义当浏览器不支持ruby元素时显示的内容

    中文或字符中文的发音或字符的解释

3.标注(双标记，与正常文字略有不同)

4.定义日期时间（双标记，定义时间文字）

5.列表

a.无序列表

类似于标记 eg：

   

• 无序列表项

   

• 无序列表项

b.有序列表

按照顺序 1，2，3....

格式与无序相似

6定义列表

/

/

创建定义列表

...

标记定义列表项

描述列表中的项目

---

2018.12.7

网页图像和多媒体元素

1.在网页中添加图片

图像是无法插入到HTML文档中的，实际上是链接到HTML文档中，因此，在元素中scr属性是必须的。

基本语法：

语法说明：scr属性的属性值是图像的URL，指明网页中要引用图像的位置，也就是指出引用图像文件的相对路径或绝对路径

指明为images文件夹中的bluef.jpg.

../表示上一级目录      /表示下一级目录




替代图像的文本——alt属性

在图片不能显示时，使用alt属性代替图片显示




图像的宽高——width和height






2.在网页中加入视频

视频的资源属性——src属性

您的浏览器不支持video元素

当视频无法正常显示时将用之间的文字代替。




视频播放控制属性——controls属性

在

您的浏览器不支持video属性




视频播放准备控件——preload

在

auto:表示当前页面加载后加入整个视频

meta：表示页面加载后只加载媒体的元数据

none：表示当前页面加载后不载入视频

您的浏览器不支持video属性




其他属性

source元素常用的几个属性 src：指出媒体源的URL地址，type指出媒体元的播放类型，通常用到视频格式中，media包含了指定的媒体源所匹配的编解码器信息

您的浏览器不支持video元素




3.在网页中加入音频元素

与

资源属性src

控制属性controls

准备播放属性preload

循环播放属性loop




4.插入多媒体文件(文本，图像，声音，动画，视频等的统称)

添加视频音频图片的方式与上面类似，width,height,type 需要时进行添加




5.链入对象