前端新人学习笔记-------html/css/js基础知识点
即将毕业的软件工程大学生一枚,秋季招聘应聘的是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基础知识点的更多相关文章
- 前端新人学习笔记-------html/css/js基础知识点(三)
这断时间家里有点事,上班也有点任务,所以几天没看视频没来更新了.今天来更新一下了. 一:默认样式重置 但凡是浏览默认的样式,都不要使用. body,p,h1,h2,h3,h4,h5,h6,dl,dd{ ...
- 前端新人学习笔记-------html/css/js基础知识点(二)
4月7日学到的知识点: 一:<img src="1.png" alt="美女"/> alt是给图片添加介绍,当图片没加载出来时,会直接显示a ...
- 前端开发学习笔记 - 1. Node.JS安装笔记
Node.JS安装笔记 Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js uses an ...
- 前端工程师面试问题归纳(一、问答类html/css/js基础)
一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...
- 前端学习:学习笔记(CSS部分)
前端学习:学习笔记(CSS部分) CSS的学习总结(图解) CSS的引入方式和书写规范 CSS的插入方式_内嵌样式 <!DOCTYPE html> <html> <hea ...
- 【学习笔记】jQuery的基础学习
[学习笔记]jQuery的基础学习 新建 模板 小书匠 什么是jQuery对象? jQuery 对象就是通过jQuery包装DOM对象后产生的对象.jQuery 对象是 jQuery 独有的. 如果 ...
- 【学习笔记】JavaScript的基础学习
[学习笔记]JavaScript的基础学习 一 变量 1 变量命名规则 Camel 标记法 首字母是小写的,接下来的字母都以大写字符开头.例如: var myTestValue = 0, mySeco ...
- Linux 学习笔记之超详细基础linux命令 Part 10
Linux学习笔记之超详细基础linux命令 by:授客 QQ:1033553122 ---------------------------------接Part 9----------------- ...
- spring mvc 及NUI前端框架学习笔记
spring mvc 及NUI前端框架学习笔记 页面传值 一.同一页面 直接通过$J.getbyName("id").setValue(id); Set值即可 二.跳转页面(bus ...
随机推荐
- 实用chrome插件
2015年最实用的9款chrome插件 随着14年chrome浏览器的市场超过IE浏览器,chrome凭借它强劲性能和出色的使用体验真正的登上了平民级的殿堂.今天小编就为大家推荐9款自己常用的chro ...
- DIV+CSS规范命名
一.命名规则说明: 1).所有的命名最好都小写2).属性的值一定要用双引号("")括起来,且一定要有值如class="divcss5",id="div ...
- C语言的本质(5)——类型转换的本质与处理
数据类型转换的方式 C 语言中的数据类型转换可分为隐式转换和显式转换两种. 隐式转换 隐式转换也可称作为自动转换,它经常以以下几种形式发生: 1.在计算一个同时出现多种数据类型的表达式时,将所有数据类 ...
- iOS5系统API和5个开源库的JSON解析速度测试
iOS5系统API和5个开源库的JSON解析速度测试 iOS5新增了JSON解析的API,我们将其和其他五个开源的JSON解析库进行了解析速度的测试,下面是测试的结果和工程代码附件. 我们选择的测试对 ...
- Android系统移植与调试之------->如何修改Android设备的开机第一阶段Logo
1.切换到~/mx0831-0525/device/other/TBDG1073/res_pack目录下 2.更换bootup和poweron文件 找一张bmp16位的图片去除后缀名将这两张都替换,转 ...
- MySQL 查询结果以百分比显示
找了一些资料,然后我是用到了MySQL字符串处理中的两个函数concat()和left()1.[CONCAT(str1,str2,...) 返回来自于参数连结的字符串.如果任何参数是 NULL, 返 ...
- 查询SQL中字符串里有多少个逗号
select len(@str)-len(replace(@str,',',''))
- 文件和文件夹权限-Win7公共盘中出现大量临时文件
公司中有一个文件服务器,给不同部门和员工设置了不同的权限,最近有员工(没有修改权限,有读取及执行,读取,写入)反映在公共盘上修改文件的时候会产生大量的临时文件,添加上修改权限之后就可以了,然后被同事问 ...
- clinit和init(转载)
clinit和init(转载) 今天在看深入Java虚拟机的class文件结构时,看到了这么一句话, 可能出现在class文件中的两种编译器产生的方法是:实例初始化方法(名为<init> ...
- JAVA GC之标记 第五节
JAVA GC之标记 第五节 OK,我们继续昨天最后留下的问题,什么是标记?怎么标记? 第一个问题相信大家都知道,标记就是对一些已死的对象打上记号,方便垃圾收集器的清理. 至于怎么标记,一般有两种方 ...