即将毕业的软件工程大学生一枚，秋季招聘应聘的是Android，今年来到公司实习，要求做前端开发，所以一切只有现学，现在根据视频来学习，然后开这个博客记录一下自己的学习过程，废话不多说，开写。

4月6日学到的知识点：

  一：<!DOCTYPE HTML>

!   声明，注意的意思；

doc document 文档的意思；

type 类型的意思；

html就不用解释了；

连在一起的意思就是：注意，文档的类型是HTML。也就是声明你写的文件的文档类型，方便浏览器解析。

 二：<meta charset="UTF-8"/>

声明代码的编码格式

注意：有些时候你声明了以UTF-8编码，但是在实际网页中中文还是显示乱码，这时候你可以去看看保存文件的时候是否采用UTF-8编码保存，因为只有保存文件的格式和网页声明的编码一致才不会导致乱码。

 三：CSS样式表

三种形式：内部样式表，外部样式表（<link href="style.css" rel="stylesheet"/>），内联样式表。

 四：background复合属性

repeat:背景图重复，默认就是背景图重复，还有no-repeat(背景图不重复)，repeat-x(水平轴上背景图重复)，repeat-y(竖直背景图重复)

10px(x轴),50px(Y轴)也可为负数。center top(水平居中，竖直在顶端),fixed(背景固定，不管怎么拖动滚动条，该背景图都固定在相应位置。)

 五：border复合属性

border-width:边框宽度；

border-style：边框样式；（solid 实线,dashed 虚线，dotted 点线,IE6不兼容）

border-color:边框颜色；

 六：padding内边距

padding属性:上右下左

注意：内边距相当于给一个盒子加了填充厚度会影响盒子的大小，若想盒子大小保持不变，就要减少相应长宽.

 七：margin外边距

块与块之间的距离。

注意：1，上下外边距会叠加，即上下两个div,设置上一个div的margin-bottom为30px,设置下面div的margin-top为30px,设置后总的外边距还是为30px,不会为60px;

2, <div id="box1"><div id="box2"></div></div>若设置box2的margin-top为10px,它的父div依旧也会有margin-top=10px的现象，即父子级包含的时候子级的margin-top会传递给父级。

设置margin-right:auto,被设置对象会靠左；

设置margin-left:auto,被设置对象会靠右；

设置margin:auto 0 ,被设置对象会水平居中。

  八：盒模型

  九：常见样式

结构样式：width:宽度；

height：高度；

background：背景；

border：边框；

padding ： 内边距；

margin： 外边距；

文本样式：font-size:文字大小（一般为偶数，最小一般设置为12px）

font-family:字体；

color:文字颜色；

line-hight：行高；

text-align:文本对齐方式；

text-indent：文本缩进(2em);

font-weight:文字着重；

font-style:文字倾斜；

text-decaration:文本修饰（下划线，上划线，删除线）

letter-spacing:字母间距；

word-spacing:单词间距；

以上是今日所学的所有知识点总结，多学多用多记，fighting!!!!!!!!!!!!!!!

前端新人学习笔记-------html/css/js基础知识点的更多相关文章

  1. 前端新人学习笔记-------html/css/js基础知识点（三）

    这断时间家里有点事,上班也有点任务,所以几天没看视频没来更新了.今天来更新一下了. 一:默认样式重置 但凡是浏览默认的样式,都不要使用. body,p,h1,h2,h3,h4,h5,h6,dl,dd{ ...

  2. 前端新人学习笔记-------html/css/js基础知识点（二）

    4月7日学到的知识点:     一:<img src="1.png" alt="美女"/> alt是给图片添加介绍,当图片没加载出来时,会直接显示a ...

  3. 前端开发学习笔记 - 1. Node.JS安装笔记

    Node.JS安装笔记 Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js uses an ...

  4. 前端工程师面试问题归纳（一、问答类html/css/js基础）

    一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...

  5. 前端学习：学习笔记（CSS部分）

    前端学习:学习笔记(CSS部分) CSS的学习总结(图解) CSS的引入方式和书写规范 CSS的插入方式_内嵌样式 <!DOCTYPE html> <html> <hea ...

  6. 【学习笔记】jQuery的基础学习

    [学习笔记]jQuery的基础学习 新建 模板 小书匠  什么是jQuery对象? jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果 ...

  7. 【学习笔记】JavaScript的基础学习

    [学习笔记]JavaScript的基础学习 一 变量 1 变量命名规则 Camel 标记法 首字母是小写的,接下来的字母都以大写字符开头.例如: var myTestValue = 0, mySeco ...

  8. Linux 学习笔记之超详细基础linux命令 Part 10

    Linux学习笔记之超详细基础linux命令 by:授客 QQ:1033553122 ---------------------------------接Part 9----------------- ...

  9. spring mvc 及NUI前端框架学习笔记

    spring mvc 及NUI前端框架学习笔记 页面传值 一.同一页面 直接通过$J.getbyName("id").setValue(id); Set值即可 二.跳转页面(bus ...

随机推荐

  1. Visual Studio 2012 Update3 安装失败错误“正在关闭管道'

    问题描述: Visual Studio 2012 update3 安装失败错误“ 正在关闭管道' 环境: Windows 7 SP1(x86和x64) Windows 8(x86和x64) Windo ...

  2. FastJSON应用前测试

    FastJSON 应用前测试 FastJSON是一个很好的java开源json工具类库,相比其他同类的json类库,它的速度的确是fast,最快!但是文档做得不好,在应用前不得不亲测一些功能.\ 实际 ...

  3. docker 私有仓库上传镜像,其他docker服务器从私有镜像下载

    <pre name="code" class="cpp">docker:/data# docker ps CONTAINER ID IMAGE CO ...

  4. Android UI ActionBar功能-自定义 Action Bar 样式

    ActionBar的样式官方提供了三种: Theme.Holo Theme.Holo.Light Theme.Holo.Light.DarkActionBar 但不仅仅是这三种,我们还可以自己定义Ac ...

  5. Linux系统下安装phpmyadmin方法

    phpmyadmin下载地址:不要分,赶紧去下载吧!http://download.csdn.net/detail/u011986449/7429799 1.找到 /libraries/config. ...

  6. PHP+jQuery实现翻板抽奖

    翻板抽奖的实现流程:前端页面提供6个方块,用数字1-6依次表示6个不同的方块,当抽奖者点击6个方块中的某一块时,方块翻转到背面,显示抽奖中奖信息.看似简单的一个操作过程,却包含着WEB技术的很多知识面 ...

  7. [转]Java虚拟机类加载机制浅谈

    Java语言是一种编译后再经过解释器执行的过程, 解释器主要就是如何处理解释Class文件的二进制字节流.JVM主要包含三大核心部分:运行时数据区,类加载器和执行引擎. 虚拟机将描述类的数据从Clas ...

  8. EXCEL破冰之旅

    1     背景 EXCEL用于日常数据分析的工具中,最便利并且最强大的莫属透视表了.因为透视表对原始数据有一定的要求,所以本次的破冰之旅也将把焦点放在如何整理基础数据这个方面. 1.1  初识透视表 ...

  9. 跨域文件crossdomain.xml在weblogic上的部署

    1.新建一个ROOT文件夹,把crossdomain.xml拷贝到这个文件夹下. 2.在ROOT文件夹下新建一个WEB-INF文件夹 3.在WEB-INF文件夹下建立一个weblogic.xml文件, ...

  10. matlab差分算法

    今天实现了<一类求解方程全部根的改进差分进化算法>(by 宁桂英,周永权),虽然最后的实现结果并没有文中分析的那么好,但是本文依然是给了一个求解多项式全部实根的基本思路.思路是对的,利用了 ...