今日笔记
1.什么是web前端
1.使用浏览器访问的程序,网站
2.网站分类:电商网站,门户网站,应用网站
3.可执行应用程序 .exe
2.web前端代码
1.代码分两种
1.运行在客户端浏览器上,前端代码
2.运行在服务器的代码,后台代码
3.web程序,是通过前端代码和后台代码,协作完成
2.前端代码,保存在服务器
3.前端代码,运行在浏览器
3.前端学习体系
1.静态页面的编写
HTML+CSS
2.添加的页面的功能:动效/交互/验证
JavaScript DOM Jquery
3.和服务器的交互
server nodeJs ajax
4.复杂开发--框架
HTML5 框架技术(bootstrap angularjs nodeJs vueJs)
4.项目概述
训练营-完成学子商城的静态首页 HTML+CSS
6.学习的难度和学习的要求
1.打字速度 http://www.codeboy.com/dz/
5个月后350
2.单词 200多个单词
3.代码量
4.表达能力--说
--------------------------------------------
正课 html+css
--------------------------------------------
1.web的基础知识
1.internet 互联网
实现信息和资源的共享
2.web前端程序就是运行在internet上的一种应用程序
程序:数据结构+算法(代码)
算法:用代码实现人的思想和行为
3.web的工作原理
1.基于浏览器和服务器还有通信协议
来实现信息的传输和显示
2.通信协议:http://
3.服务器 tomcat IIS apche 软件
java php c++ .net
nodeJS
4.浏览器--国内没有自主研发的浏览器核心代码(内核)
ie Firefox opera chrome safari
5.浏览器的发展历史
浏览器第一次世界大战 - 网景 被收购告终 - firefox
浏览器第二次 ie退出历史舞台
2.html概述
1.超文本标记语言 hyper text markup language
2.特点
1.以.html为后缀
2.由浏览器解析执行
3.可以嵌套脚本语言 JavaScript
4.使用带有尖括号 <> 的标记
3.标记
1.什么是标记
由尖括号包围的关键字 <div>
每一种标记,有相应的功能
2.分类
1.封闭类型标记/标签/元素/节点
双标签
<关键字></关键字>
<div></div>
2.非封闭类型
单标签
<关键字>或者<关键字/>
<img>
<meta>
3.属性
<关键字 属性1="值1" 属性2="值2"></关键字>
<div id="d1" title="" style=""></div>
共有的属性
id class title style
4.标签的嵌套
<div>
<p></p>
</div>
<ul>
<li>
<a></a>
</li>
</ul>
使用tab键,写缩进,显示层进关系
总结:学习html,就是学习不同标签关键字,及其功能
学习固定的属性,和嵌套关系
3.html的标准结构
1.声明文档类型
<!doctype html>
告诉浏览器,使用HTML5版本来运行这篇代码
2.根标签
<html></html>
在根标签内部
head头部--定义页面全部信息
<head></head>
body主体--所有页面上显示的内容
<body></body>
4.文本标签
1.标题元素
hn~ <h1></h1> <h6></h6>
特点:
1.h1最大,h6最小
2.字体加粗
3.上下有垂直空间
属性
align:left | center | right
2.段落元素
<p></p>
特点:上下有垂直空间
3.回车换行
<br>或者<br/>
4.水平线
<hr>
5.文本样式标签
<i></i> <em></em> 斜体
<u></u> 下划线
<b></b><strong></strong> 粗体
<s></s><del></del> 删除线
练习:
1.描述你的男票/女票的日常
2.描述理想中的择偶标准
作业:
1.笔记看一遍
2.所有demo敲一遍
3.html标准结构
4.使用文本标签写自己的简历
今日问题及解决
今天是第一次使用editplus这个软件，碰到了问题，改成utf-8之后页面还是乱码，尝试并查找方法后解决
在head中添加<meta charset="UTF-8">就能解决了。 <meta charste="utf-8"> 只是告诉浏览器要用utf-8来解释，而文档的编码，是在你保存时的选择决定的。
