前端开发知识学习概要

  • 前端开发工具

编辑器

editPlus

sublime

浏览器:

Chrome

Safari

Firebox

IE

插件:firebug

chrome:

inspect element

  • html 组成结构
 1 <!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前,不是 HTML 标签;
 2 它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令, 浏览器读取。
 3 <html>
 4 <head>
 5 描述页面的头部信息,如页面的标题、作者、摘要、关键词、版权、自动刷新等信息,方便搜索引擎读取。
 6 <meta>
 7 </head>
 8 <body>
 9 网页主体内容,
10 </body>
11 </html>

  

  • 网页布局

大多数网站会把内容安排到多个列中(就像杂志或报纸那样)。

可以使用 <div> 或者 <table> 元素来创建多列。CSS 用于对元素进行定位,或者为页面创建背景以及色彩丰富的外观。

标签 描述
<div> 定义文档中的分区或节(division/section)。
<span> 定义 span,用来组合文档中的行内元素
  • 盒模型

标准 W3C 盒子模型的范围包括 margin、border、padding、content,并且 content 部分不包含其他部分。

内容(CONTENT)就是盒子里装的东西;

而填充(PADDING)就是怕盒子里装的东西(贵重的)损坏而添加的泡沫或者其它抗震的辅料;

边框(BORDER)就是盒子本身了;至于边界(MARGIN)则说明盒子摆放的时候的不能全部堆在一起,要留一定空隙保持通风,同时也为了方便取出。在网页设计上,内容常指文字、图片等元素,但是也可以是小盒子(DIV嵌套),与现实生活中盒子不同的是,现实生活中的东西一般不能大于盒子,否则盒子会被撑坏的,而CSS盒子具有弹性,里面的东西大过盒子本身最多把它撑大,但它不会损坏的。

填充只有宽度属性,可以理解为生活中盒子每个HTML标记都可看作一个盒子。

  • html学习思维导图

##############################

注意:

1.要加doctype,----导致低版本IE不兼容

2.id不能为数字

3.编码要求 中文编码charset=utf-8。文件编码和申明编码一致

前端开发知识学习概要,布布扣,bubuko.com

时间: 08-08

前端开发知识学习概要的相关文章

前端开发基础学习—1

前端开发的学习还没有找到很好的入门点,就做些题吧. http://www.cnblogs.com/jQing/archive/2012/07/01/2571987.html 第一部分:用CSS实现布局 让我们一起来做一个页面 首先,我们需要一个布局. 请使用CSS控制3个div,实现如下图的布局. 第二部分:用javascript优化布局 由于我们的用户群喜欢放大看页面 于是我们给上一题的布局做一次优化. 当鼠标略过某个区块的时候,该区块会放大25%, 并且其他的区块仍然固定不动. 提示: 也许

web前端开发 初学者 学习路径图

      第一阶段   web前端工程师课程 HTML语句,HTML页面结构.css语法.style属性.link和style标签.id属性.等HTML语句中的相关属性: 通过Dreamweaver制作出跨越平台限制和跨越浏览器兼容性的页面,掌握Dreamweaver成为Web前端工程是的关键. 浏览器兼容性问题处理:XHTML与CSS校验,XHTML校验器,CSS校验器:解决如:Chrome.Safari.firefox.opera 等主流浏览器的兼容问题. 第二阶段 WEB前端移动端+响应

web前端工程师知识学习路线

想要成为一名优秀的web前端工程师(http://www.maiziedu.com/course/web/)需要具备哪些技能?因为web前端开发涵盖了许多领域的技术,那么需要掌握的技能有哪些呢?下面就一起来看看web前端工程师必备技能知识. 1.界面和用户体验 注意,浏览器的实现标准是不一致的,请确保你的网站能够兼容所有主流的浏览器.最少需要测试的有 Gecko 引擎(Firefox),WebKit引擎(Safari以及一些手机浏览器),Chrome,你所要支持的 IE 浏览器,以及 Opera

关于前端方面知识学习的全面开始

论文已经提交完成了,接下来的事情就是全身心地投入到前端的学习中去,现在规划思路和计划. 要点和思路: 要以基础为本,配合一定的记忆.许多时候觉得记忆不再重要了,其实不是,记忆对于HTML/CSS/JS的掌握是很有必要的.前端知识万变不离其宗,掌握好这三者的基本知识是最重要的. 要有练兵.练习能够加深知识的印象,在学习过程中经常会眼高手低,经常训练才能熟练. 迅速掌握.前端方面知识十分零碎,要有思路.有计划地去学习,而且每一部分内容务必心无旁骛地迅速掌握. 学习规划:

前端开发,学习哪些技术呢?

前端开发以html,css,js技术为基础. 先学习html,css,js,进阶学习框架JQuery,MUI,Vue,Element UI,Bootstap等. 在做项目中不断提升自己. 前端开发学习技术图(供参考): HTML——超文本标记语言,用来定义网页的文档结构 CSS——叠层样式单,用来修改网页的显示外观 Javascript——编程动态修改HTML结构和属性,修改CSS 其他框架以这三种技术为基础 JQuery——消除了浏览器兼容问题,简化了Javascript操作 Vue——近期很

前端开发入门学习笔记(一)

HTML:超文本标记语言. html:是一个基础结构. CSS:就是跟网页做装修的,修饰HTML的基础内容:样式. JavaScript:一个网页的行为,动作,动态的东西. html标准文件格式:<!DOCTYPE html><html><head><meta charset="UTF-8"/><title>标题</title></head><!--我是头部 周围包括的符号为注释--><

DataTables学习:从最基本的入门静态页面,使用ajax调用Json本地数据源实现前端开发深入学习,根据后台数据接口替换掉本地的json本地数据,以及报错的处理地方,8个例子(显示行附加信息,回调使用api,动态显示和隐藏列...),详细教程

一.DataTables  个人觉得学习一门新的插件或者技术时候,官方文档是最根本的,入门最快的地方,但是有时候看完官方文档,一步步的动手写例子,总会出现各种莫名其妙的错误,需要我们很好的进行研究出错的地方. 官方网站(中文):http://datatables.club/ 官方网站:https://www.datatables.net/  二.简单的例子 怎样简单地使用DataTables?使用下方简单的几行代码,一个方法初始化table. $(document).ready(function

前端开发手册

做前端有一段时间了,但是总觉得前端就是写写界面就行了,其实不然.一个合格的前端责任是很重大的.本文介绍重点介绍了前端人员需要掌握的一些技能.供大家参考.如果有一些对前端开发还有疑惑的童鞋,可以来看看. 本文来源:http://wiki.jikexueyuan.com/project/fedHandlebook/,建议阅读在线版本:https://dwqs.gitbooks.io/frontenddevhandbook/ 什么是前端开发者? 一个前端开发者, 要会使用Web技术(如:HTML,CS

如何成为一个优秀的web前端开发工程师

一.技术的必须的 作为一名最基础的前端工程师你必须掌握HTML.CSS和 JavaScript.三者必须同时精通,类似我字样对前端知识一知半解的,一遇到问题就停下工作就四处搜索解决方案的,首先就算不上一个合格的前端人 员.像我这样的如果当了前端工程师那工期肯定是不能保证的.合格的前端工程师第一要学会的就是在没有任何外来帮助的情况下(包括搜索引擎),能够完成大多 数任务. 以下知识点是作为一个前端工程师必须了解和熟悉的: DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动. DO