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.<h1></h1>就是标题标签 通过向两者之间输入文字作为标题
2.<p></p>是段落标签
3.img标签来完成的，它在网页上的代码写成<img src="1.jpg">
4.<html></html>称为根标签，所有的网页标签都在中。
5. <head>标签用于定义文档的头部，它是所有头部元素的容器。（通常包含标题信息，元数据，脚本代码等）
文档的头部描述了文档的各种属性和信息，包括文档的标题等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。
下面这些标签可用在 head 部分：
<head>
<title>...</title>
<meta>
<link>
<style>...</style>
<script>...</script>
</head>
<title>标签：在和标签之间的文字内容是网页的标题信息，它会出现在浏览器的标题栏中。网页的title标签用于告诉用户和搜索引擎这个网页的主要内容是什么，搜索引擎可以通过网页标题，迅速的判断出网页的主题。每个网页的内容都是不同的，每个网页都应该有一个独一无二的title。
6. 在<body>和</body>标签之间的内容是网页的主要内容，如<h1>、<p>、<a>、<img>等网页内容标签，在这里的标签中的内容会在浏览器中显示出来
7.代码注释<!--注释文字 -->
2018.12.3
昨天在二手书店买到了一本叫做《HTML5+CSS网页设计案例教程》的书。
于是开始了正规的学习
本书基本是用记事本进行网页开发 据说是有利于打下基础
首先建立站点根目录用于存放网页->接下来编写代码->保存记事本是应用.html格式 且将文件类型改为所有类型。
接下来讲的基本就是在慕课上讲到的HTML的基本语法了
HTML基本语法
1.HTML标记
eg：单标记与双标记
单标记：不需要前后对应，单独使用即可完整的表达意思。是用形式<标记/>，如<br/>表示换行，HTML5之前<br>是正确的。
双标记：必须成对出现，包含始标记和尾标记。标记可以成对嵌套但不能交叉嵌套。
2.HTML属性
与标记相关的特性称作属性，它是对标记的必要说明，HTML属性能够赋予元素含义和语境，一般要为属性赋值。
eg：<a href="http://www.baidu.com">百度一下</a>
<a>...</a>是超链接标记，“href”是属性，“http://www.baidu.com”是属性值
<标记名 属性1=“ ” 属性2=“”...>
(1).属性均放在相应标记的尖括号内属性之间用空格分开
（2）.不建议属性值包含空白，但允许属性值包含空白
2018.12.4
HTML 头部<head>
a.<title>标题栏中出现的内容</title>
b.定义元数据 <meta>
MATE元数据 用来描述 HTML的信息 使用<mate>元素来提供页面的元信息，如网页的关键字，作者信息，网页过期时间。
<mate>位于文档的头部，它定义的信息不会出现在网页中，仅在源文件中显示。
一个HTML文档的头部可以有多个<mate>标记，
常用元数据：
charset 字符集 定义网页使用的字符集
<mate charset="UTF-8"/>
搜索引擎关键字
将mate元素的name属性的属性值设置为keyworks，就可以想搜索引擎说明网页的关键字
<mate name="keywords" content="关键字，关键字，..."/>
设置网页定时跳转
当<mate>标记的http-equiv属性值设置为refresh时，就可以设置页面在经过一定时间后自动刷新，或者在一定时间后自动跳转到其他页面。页面定时刷新或跳转的基本语法格式：
<mate http-equiv="refresh" content="秒" [url="资源路径"/]>
语法中，"[url="资源路径"]"是可选项，如果有此项对应的网址或者路径，则页面定时跳转；否则定时刷新
2018.12.5
HTML的主体<body>
1.添加文字
可以正常向body中添加文字，而其中控制空格的方式有所不同通过 来控制空格，几个空格就输入几个 。
2.添加特殊符号
常用特殊符号
3.代码注释<!--注释文字 -->。
4.换行控制符<br/>
5.段落是<p></p> 在开始标记和结束标记之间形成一个段落。p元素会自动在其前后创建一些空白，浏览器会自动在段落间添加这些空间。
6.<hr>水平线
7.标题文字由<h1> -> <h6>(1-6字号由大到小，同样是双标记)
8.强调文本
<b>强调粗体文本</b>
<i>强调斜体文本</i>
9.插入，删除（个人感觉没有任何卵用）
<ins>插入的文本</ins>(就是加一个下划线）
<del>删除的文本</del>(就是这样)
10.小型文本 小角标（标签 商标等）
2018.12.6
1.上下标（如平方）
<sub>下表文本</sub>
<sup>上标文本</sup>
2.注音文本（显示在文字上方 如：拼音）
rp元素定义当浏览器不支持ruby元素时显示的内容
<ruby>
中文或字符<rt>中文的发音或字符的解释</rt>
</ruby>
3.标注(双标记，与正常文字略有不同)
<cite>
4.定义日期时间（双标记，定义时间文字）<time>
5.列表
a.无序列表<ul>
类似于标记 eg：
<ul>
<li>无序列表项</li>
<li>无序列表项</li>
</ul>
b.有序列表<ol>
按照顺序 1，2，3....
格式与无序相似
6定义列表<dl>/<dt>/<dd>
创建定义列表<dl>...</dl>
<dt>标记定义列表项
<dd>描述列表中的项目
2018.12.7
网页图像和多媒体元素
1.在网页中添加图片
图像是无法插入到HTML文档中的，实际上是链接到HTML文档中，因此，在<img>元素中scr属性是必须的。
基本语法：<img src="url">
语法说明：scr属性的属性值是图像的URL，指明网页中要引用图像的位置，也就是指出引用图像文件的相对路径或绝对路径
<img scr ="images/bluef.jpg"/>
指明为images文件夹中的bluef.jpg.
../表示上一级目录 /表示下一级目录
替代图像的文本——alt属性
在图片不能显示时，使用alt属性代替图片显示
<img scr ="images/bluef.jpg" alt="替代文本"/>
图像的宽高——width和height
<img src="url" width="像素（..px）|百分比（..%）" height= "像素（..px）|百分比（..%）"/>
2.在网页中加入视频<video>
视频的资源属性——src属性
<video src="视频路径"/>
您的浏览器不支持video元素
</video>
当视频无法正常显示时将用<video>与</video>之间的文字代替。
视频播放控制属性——controls属性
在<video>元素中controls属性设置是否为视频添加浏览器自带的播放控制条s
<video src="视频路径" controls="controls"/>
您的浏览器不支持video属性
</video>
视频播放准备控件——preload
在<video>元素中，如果设置preload属性，则在页面加载时就加载视频，并且准备播放，该属性有三个可选择的值:auto,meta,none 默认值auto
auto:表示当前页面加载后加入整个视频
meta：表示页面加载后只加载媒体的元数据
none：表示当前页面加载后不载入视频
<video src="视频路径" preload="auto"/>
您的浏览器不支持video属性
</video>
其他属性
<video>与<source>的配合使用
source元素常用的几个属性 src：指出媒体源的URL地址，type指出媒体元的播放类型，通常用到视频格式中，media包含了指定的媒体源所匹配的编解码器信息
<video>元素中科院指定多个source元素，浏览器按source标记的顺序检测指定的视频是否能播放，如果不能换下一个，此方法多用于兼容不同的浏览器
<video controls="controls"/>
<source src="rabit.ogv" type="video/ogg"/>
<source src="rabit.mp4" type="video/mp4"/>
<source src="rabit.webM" type="video/webM"/>
您的浏览器不支持video元素
</video>
3.在网页中加入音频元素<audio>
与<video>元素相似，没有width，height，poster
资源属性src
控制属性controls
准备播放属性preload
循环播放属性loop
4.插入多媒体文件<embed>(文本，图像，声音，动画，视频等的统称)
<embed src="url" width="像素" height="像素" type="类型"></embed>
添加视频音频图片的方式与上面类似，width,height,type 需要时进行添加
5.链入对象<object>
<object>元素可以定义一个嵌入的对象。可以使用<object>元素想web页面中添加文件。
<object>元素支持多种不同的媒介类型，如图片，音频，视频等
使用<object>元素是必须要指定的date属性和type属性。
在页面中嵌入图片
<object type="image/jepg" date="flower.jpg" height....><object>
在页面中嵌入网页
<object type="text.html" date="http://www.baidu.com" ....></object>
6.定义媒介分组和标题<figure>/<figcaption>
<figure>元素是一种元素的组合，可以带有标题。<figure>元素用来规定独立的流内容，表明网站的制作页面上一块的独立内容，将其从页面上移除后不会对页面上的其他内容造成影响。<figcation>可以定义<figure>元素的标题。
<figure>
<figcaption>标题</figcaption>
...
</figure>
一个<figure>元素内仅有一个<figcaption>
2018.12.8
超链接
链接：链接标记<a>文本或图片</a>，将文件或图片标识为链接源点
属性href=...，标记<a>的最基本属性
路径地址(URL)
11.14
至于为什么更新到超链接不更新了，主要是html和css内容比较简单的，但是相对多而杂，如果这样的学习，肯定记得会更牢固，到速率就比较慢了，为了早点完成一个静态网页的设计，还是赶快学完了
前几天主要忙着学高数（考研猛做课后题），倒是把前端的学习拉下了，因此今天我把html css基本学完了，并且准备着手设计我的网页了。
人生路漫漫，道阻且长。
12.17
虽然不知道这两天在干啥，但确实是这个静态网
页的设计，今天一天的时间就完成了，网页设计的也比较简单，当然html和css还是比较好掌握的，虽然知识点比较杂。
首先我的网页是我的一个主页，所以要包含个人介绍，个人博客（我直接链接到简书了 哈哈哈哈），写博客，登录，注册，最近资讯。
因为我想到所有的都用同一个设计 ，于是我将css和html分开写通过link连接到html中。
这是很简单的一个过程 主要的设计在css中
其中container 父div样式（html文件总体上表现为外层使用id为container的div盒子）
begin是导航栏通过区块显示从而写出来水平菜单，其中涉及到div与span的区别
以下是在没有对开发网页页面设置css样式时候情况下，系统默认情况下的介绍
div与span区别
div占用的位置是一行，
span占用的是内容有多宽就占用多宽的空间距离
网友评论