p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC" }
p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC"; min-height: 25.0px }
p.p3 { margin: 0.0px 0.0px 10.0px 0.0px; font: 18.0px "PingFang SC" }
p.p4 { margin: 0.0px 0.0px 10.0px 0.0px; text-align: justify; font: 18.0px "PingFang SC" }
p.p5 { margin: 0.0px 0.0px 10.0px 0.0px; text-align: justify; font: 18.0px "PingFang SC"; color: #424242 }
p.p6 { margin: 0.0px 0.0px 10.0px 0.0px; text-indent: 28.0px; font: 18.0px "PingFang SC" }
span.s1 { color: #000000 }
span.s2 { color: #424242 }

一个web初学者的总结

html部分

1. 纯文本语言，javascript、css、java、txt、html，纯文本只有文本内容，无法记录文本样式。

2. html(hyperText Markup Language)，超文本标记语言，就是通过标签对，给纯文本添加语义，实际上其实是用文本文本添加语义，并且可以添加图片、链接、视频等，一对对的标签成了标记，所以构成了“超文本标记语言”。

3.文档声明头，任何一个标准的html页面，第一行一定是以

<!DOCTYPE html>,这是文档声明头。

4. 字符集采用meta标签定义，meta表示“元”配置，表示基础的配置项目，charset就是字符集。

5. 常用的两种字符集：utf-8. 全球国际通用，里面涵盖了所以人类语言，一个汉字3个字节，保存尺寸大，加载慢。gb2312. 是国标，是中国的字库，里面仅仅涵盖了汉字和常见的英文，一个汉字2个字节，保存尺寸小，加载快。

6. meta出了可以设置字符集，还可以设置关键字和页面描述，description设置页面描述；keyword关键字，告诉搜索引擎，这个网页做什么的，能提高搜索效率，让别人能快速找到。

7. html对换行不敏感，对tab不敏感，不是依靠缩进来表示嵌套的，就是看标签的包裹关系，但是我们发现良好的缩进，代码更加易读，要求大家正确的缩进标签。

8. html中所以文字，如果有空格，换行，tab都会被折叠成一个空格显示。

9. html的标签有两种类型，容器级和文本级；容器级的标签里面可以存放任何东西，文本级的标签只能放文字，图片，表单元素。

10. 自封闭标签，也称为单标签，因为没有反标签。

11. 链接的target=_blank属性：如果没有在相同的标签打开，如果有，就在新的空白标签中打开，并且跳转的标签页还存在。

css部分

1.列表有三种：无序列表，有序列表，自定义列表。无序列表(unordered list)：用来表示一个列表语义，并且每个项目之间不分先后顺序。有序列表(ordered list)：一般很少使用有序列表，基本使用无序列表。自定义列表：dl(definition list)定义列表，dd(definition title):定义标题，dd(definition  description):定义表述词。

2.div(division)和span是盒子模型最重要的标签之一，div中的所有元素是一块区域，div是容器级的标签;span是文本级标签。

3.html负责结构，css负责样式，js负责行为。

4.标签选择器，使用html中的标签当选择，所有标签都能当选择器，选择的是所有，而不是某一个，是共性，不是特性。

5.类选择器，类就是class属性，任何标签都可以有class属性，class属性可以重复使用，一个标签可以属于多个类，用空格隔开。

6. id选择器，任何标签都可以有id，id命名以字母开头，可以有字母、数字、大小写严格区分；同一个页面不能重复，即使是不一样的标签，也不能有相同的id。在css中尽可能使用class，除非特殊才有id，id是js用的，js通过id属性得到标签。

7. 一个标签可以同时被多种选择器选中，这些选择器可以选上同一个标签，来控制标签的内容(html)，动作(js)，排版(css)。

8. 后代选择器，是一种共性、特性的平衡，当要把某个部分的所有的内容，进行样式改变，就要想到后代选择器。

9.交集选择器，要满足两个条件，必须都是同一个标签，必须有同一个类选择，可以连续交。

10.并集选择器，用逗号隔开就是并集选择器。

11. 通配符，*代表所有的元素，效率不高，所以使用频率不多。

12.同一个标签有多个类名，有冲突，通过！important提高一个属性 的权重；！important提升的是一个属性，而不是选择器，无法提升继承的权重，不影响就近原则。

13.盒子模型：一个模型主要有5个：width,height,padding(内边距) ,margin(外边距),border。

14.边框的三要素：粗细，线性，颜色；线性.dashed、dotted、solid、double、groove、ridge、inset、outset。

15. html将标签分为容器级和文本级，容器级有div、dt、dd、h、li。文本级有p、b、span、a、em、i、u。css将标签分为块级元素和行内元素，块级元素有div、p、dt、dd、h、li，行内元素有b、span、a、em、u、i。

16. 块级元素:霸占一行，不能与其他任何元素并列；能接受宽高；如果不设置宽度，默认为父亲的100%。行内元素：与其他行内元素并排；不能设置宽高，默认是文字的宽度。

17.Display:”显示模式”，用来修改元素的行内、块级的性质

Inline就是“行内”

一旦给当前一个便签设置 display：inline 这个标签立刻改变为行内元素与span类似没有区别

一旦给当前一个便签设置 display：block 这个标签立刻改变为块级元素与div类似没有区别

18.清除浮动

1. clear：both(表示当前自己内部的元素不受其他盒子的影响)

2. overflow：hidden(超出范围就隐藏)

3.浮动的元素，只能被有高度的盒子高度，如果盒子的          内部有浮动，那么浮动会在一定范围内互相影响(加高法)。

19.css中任何文本都有行高(line-height)，行的 高度，必须有元素对应的高度，才能使用。

20.text-indent:2em，首行空两个汉字的格，单位em，indent缩进的意思。

21.font-size(尺寸) line-height(行高) font-family(字体)；页面中，中文使用：微软雅黑，宋体，黑体。需要其他字体，需要切图。英文：Arial、Times New Roman。

22.超链接的伪类

:link  表示，用户没有点击过这个链接的样式。是英语“链接”。

:visited 表示，用户访问过这个链接的样式。是英语“访问过”。

:hover  表示，用户鼠标悬停时候的样式，是英语“悬停”。

:active  表示，用户用鼠标点击过这个链接，但不松手，此时的样式。是英语“激活”。

23. z-index,只有定位的元素才有这个属性，不管是绝对定位，还是相对定位，数值大的在上面，float不能使用。

javascript部分

1. html 结构层，从语义上来说，描述页面的结构。

css  样式层，从审美的角度，美化页面

js  行为层，从交互的角度，提升用户体验。

2.布兰登·艾奇（Brendan Eich，1961年～），JavaScript之父JavaScript ，js诞生于1995年。

3. js是弱语言，变量只需要var来声明。

4. js是前台语言，而不是后台语言；后台语言运行在服务器上，前端运行在客户的电脑里面。

5. 程序由上到下依次执行，执行完上面的才执行下面的。

6. javascript对换行、缩进、空格不敏感。注意:每一条语句末尾都要加分号，虽然分号不是必须加的，如果不加分号，压缩过后不能运行。

7. 直接量也叫字面量，数值的直接表达就是直接写上去，不需要任何的符号。字符串一定要加引号。

8. 变量的命名规则：只能由字母、数字、下划线、美元($)符号构成，且不能以数字开头，严格区分大小写，不能使用空格，长度不能超过225个字符，还不能是js的保留字。

9. 连接符和加号，如果加号两边是数值，就是加号，否则就是连接符。

10. 运算符有：数学运算符，逻辑运算符、自增运算符等。

11. Math.pow(乘方),Math.sqrt(开根号)。

12. alert():提示框，prompt():输入框，parseInt():只能保留开头的数字，后面的自动消失，console.log(在控制台输出)，document.write()：文档打印输出，document文档对象，不可省略。

13. if:选择结构语句，给程序添加多个执行路线，for:循环语句，将结构类似的语句重复执行。

14. js用function来声明函数，函数的命名规则和变量命名规则一样。

15. 常用的事件名

onclck:鼠标单击

ondblclick:鼠标双击

onkeyup：按下并释放键盘上的一个键时触发

onchange: 文本内容或下拉菜单中的选项发生改变

onfocus：获得焦点，表示文本框等获得鼠标光标

onfocus：失去焦点，表示文本框等失去鼠标光标

onmouseover: 鼠标悬停，即鼠标停留在图片等的上方

onmouseout: 鼠标移出，即鼠标离开图片等所在的区域

onload：网页文档加载事件

onunload：关闭网页时

onsubmit： 表单提交事件

onreset： 重置表单

16. 事件三要素：事件源，事件，事件处理程序

17. 隐藏样式

Display: none； display: block ;  显示的意思

Visibility: hidden;    visibility: visible  显示的意思

Display  隐藏不占位置

Visibility:hidden 隐藏占有位置   停职留心

Overflow:hidden;   隐藏超出的部分

18. 入口函数

window.onload=function(){

内部放js代码

}

这个函数，当我们的页面加载完成之后，采取执行函数体里面的内容的JS部分。页面的结构样式、节点加载完成之后，执行当前这个函数。

19. js数据类型：数值型(number)，利用Number()转换为数值型；布尔型（BOOLean)，利用！！转换成布尔类型；字符串(string)利用String

()转换成字符串；NULL(空)；Underfined(没有找到)。

一个web初学者的笔记总结的更多相关文章

  1. ASP.NET MVC Web API 学习笔记---第一个Web API程序

    http://www.cnblogs.com/qingyuan/archive/2012/10/12/2720824.html GetListAll /api/Contact GetListBySex ...

  2. 对于一个WEB前端初学者，学前端应该注意，有什么技巧

    web前端经验总结需要注意的地方和技巧如下: 1.编程思维 学习web前端开发核心在于一个“编程思维”,因为每段代码都不一样,都需要分别去看,所以只要你掌握了学习web前端的编程思维,那么写程序对于你 ...

  3. go语言，golang学习笔记4 用beego跑一个web应用

    go语言,golang学习笔记4 用beego跑一个web应用 首页 - beego: 简约 & 强大并存的 Go 应用框架https://beego.me/ 更新的命令是加个 -u 参数,g ...

  4. Spring MVC 学习笔记2 - 利用Spring Tool Suite创建一个web 项目

    Spring MVC 学习笔记2 - 利用Spring Tool Suite创建一个web 项目 Spring Tool Suite 是一个带有全套的Spring相关支持功能的Eclipse插件包. ...

  5. Go语言笔记[实现一个Web框架实战]——EzWeb框架(一)

    Go语言笔记[实现一个Web框架实战]--EzWeb框架(一) 一.Golang中的net/http标准库如何处理一个请求 func main() { http.HandleFunc("/& ...

  6. 手把手和你一起实现一个Web框架实战——EzWeb框架(二)[Go语言笔记]Go项目实战

    手把手和你一起实现一个Web框架实战--EzWeb框架(二)[Go语言笔记]Go项目实战 代码仓库: github gitee 中文注释,非常详尽,可以配合食用 上一篇文章我们实现了框架的雏形,基本地 ...

  7. 手把手和你一起实现一个Web框架实战——EzWeb框架(三)[Go语言笔记]Go项目实战

    手把手和你一起实现一个Web框架实战--EzWeb框架(三)[Go语言笔记]Go项目实战 代码仓库: github gitee 中文注释,非常详尽,可以配合食用 本篇代码,请选择demo3 这一篇文章 ...

  8. 手把手和你一起实现一个Web框架实战——EzWeb框架(四)[Go语言笔记]Go项目实战

    手把手和你一起实现一个Web框架实战--EzWeb框架(四)[Go语言笔记]Go项目实战 代码仓库: github gitee 中文注释,非常详尽,可以配合食用 这一篇文章主要实现路由组功能.实现路由 ...

  9. 手把手和你一起实现一个Web框架实战——EzWeb框架(五)[Go语言笔记]Go项目实战

    手把手和你一起实现一个Web框架实战--EzWeb框架(五)[Go语言笔记]Go项目实战 代码仓库: github gitee 中文注释,非常详尽,可以配合食用 本篇代码,请选择demo5 中间件实现 ...

随机推荐

  1. hdu 5611 Baby Ming and phone number（模拟）

    Problem Description Baby Ming collected lots of cell phone numbers, and he wants to sell them for mo ...

  2. SQL Server,Oracle,DB2索引建立语句的对比

    原文引至:http://jvortex.blog.163.com/blog/static/16961890020122141010878/ 我们知道,索引是用于加速数据库查询的数据库对象.原理就是减少 ...

  3. 01-Java学习笔记

    本系列笔记由常彦博整理,请知悉 目  录 一. Java技术基础.................................................................... ...

  4. jqGrid源代码分析（一）

    废话少说.先上grid.base.js 整体结构图 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3B5MTk4ODEyMDE=/font/5a6L5L2 ...

  5. 《Swift开发指南》国内第一本Swift图书上市了

    <Swift开发指南>国内第一本Swift图书上市了 既<courseId=799262">苹果Swift编程语言开发指南>视频教程地址:courseId=79 ...

  6. android开发步步为营之65:解决ScrollView和ListView触摸事件onInterceptTouchEvent相互冲突问题

    近期项目里面有个需求,一个页面放了一个ScrollView,整个页面能够向上滚动,然后ScrollView里面又嵌套了一个ListView,ListView里面的数据也是能够上下滑动的,理论上List ...

  7. c++编程碰到的奇怪问题与解决

    今天写一个工具,调试过程中莫名其妙崩溃,类某些成员变量指针很奇怪,为0x00003001.最后检查的结果居然是这样的: 文件class1.h: class1 { int a; int b; } 文件: ...

  8. docker虚拟化之将容器做成镜像

    1,docker ps -a 选择要启动的容器. 2,docker start  容器+ID 启动容器 3,docker exec -i -t   容器ID /bin/bash   进入容器 这里的/ ...

  9. 一个Demo就懂的Angular之directive

    <body> <div ng-controller="myCtrl"> <hello-word></hello-word> < ...

  10. select选项改变时获取选中的option的值

    本来天真的以为直接this.value()就能去到select的值,可事实并非那么回事. <script> document.getElementById('select').onchan ...