即将毕业的软件工程大学生一枚,秋季招聘应聘的是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. Silk Mobile – 缩短移动应用的测试周期

    Micro Focus已将从Borland接管的Silk Mobile™投放到市场,作为一种新的强大的移动应用测试解决方案,它将使企业能够开发出更先进更可靠的移动商业软件. 作为市场上最完整的移动应用 ...

  2. XCode工程中ARC模式与非ARC模式共用(转)

    Xcode 项目中经常会融合一些老的代码,它们可能采用非ARC的模式.混合编译时,就会碰到编译出错的情况. 如何共用ARC模式和非ARC模式呢? XCode除了提供整个项目是否使用ARC模式的选择外, ...

  3. HDU Today(dijskra)

    HDU Today Time Limit: 15000/5000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total ...

  4. [Phonegap+Sencha Touch] 移动开发36 Phonegap/Cordova项目的图标和启动画面(splashscreen)配置

    原文地址:http://blog.csdn.net/lovelyelfpop/article/details/40780111 Phonegap/Cordova项目中的config.xml文件.里面配 ...

  5. CSS垂直水平居中

    小小的总结一下:行内元素水平居中用text-align: center;块级元素水平居中用margin-left: auto; margin-right: auto; 首先讨论一下单行时的情况. 毫无 ...

  6. oracle丢失temp表空间处理

    之前有做临时表空间的切换,切换后没drop tablespace就删除了temp01.dbf结果排序跟查dba_temp_files报错 SQL Mbytes from dba_temp_files; ...

  7. CentOS 修改默认语言

    查看所有的locale语言 [root@centos6 ~]# locale -a ... ... ... ... xh_ZA xh_ZA.iso88591 xh_ZA.utf8 yi_US yi_U ...

  8. js对表单设置了readonly和disabled后的区别

    Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: 1)Readonly只针对input(text / pa ...

  9. Java SE基础部分——常用类库之NumberFormat(数字格式化)

    数字格式化常用方法:DecimalFormat和NuberFormat. //2016060524 数字格式化学习 //数字格式化 两种方法 一种直接使用NumberFormat,另一种Decimal ...

  10. 如果不知道MySQL当前使用配置文件(my.cnf)的路径的解决方法

    如果不知道当前使用的配置文件的路径,可以尝试下面的操作: # which mysqld /usr/local/mysql/bin/mysqld # /usr/local/mysql/bin/mysql ...