前端新人学习笔记-------html/css/js基础知识点(三)
这断时间家里有点事,上班也有点任务,所以几天没看视频没来更新了。今天来更新一下了。
一:默认样式重置
但凡是浏览默认的样式,都不要使用。
body,p,h1,h2,h3,h4,h5,h6,dl,dd{margin:0; font-size:12px;/* font-family:XX; */}
ol,ul{list-style:none;padding:0;margin:0;}
a{text-decoration:none;}
img{border:none;}
二:块元素和内嵌元素
块元素的特征:
1.默认独占一行;
2.没有宽度时,默认撑满一排;
3.支持所有css命令;
内联元素的特征:
1.同类的标签可以在同排显示;
2.不支持宽高;
3.内容撑开宽度;
4.不支持上下的margin和padding;
5.代码换行被解析;
三:块元素和内嵌元素的转换
display:block 使内联元素具备块属性标签的特性;
display:inline 使块元素具备内嵌元素的特性。
display:inline-block
特性:1.块在一行显示;
2.行内属性标签支持宽高;
3.没有宽度的时候内容撑开;
问题:1.代码换行被解析;
2.ie6,7不支持块属性标签的inline-block;
四:浮动
1.块在一排显示;
2.内联元素也支持宽高了;
3.默认内容撑开宽度;
4.脱离文档流;
5.提升层级半层
<div style="float:left;">wo shi div</div>
这个时候div标签就和里面的内容位于同一层级了。
<style>
body{ font-size:20px;}
.box1{ width:100px;height:100px;background:red; float:left;}
.box2{ width:200px;height:200px;background:blue;}
</style>
</head>
<body>
<div class="box1">box1</div>
<div class="box2">box2</div>
</body>
这个时候会出现这样的现象,这就和提升了半个层级有关。
前端新人学习笔记-------html/css/js基础知识点(三)的更多相关文章
- 前端新人学习笔记-------html/css/js基础知识点
即将毕业的软件工程大学生一枚,秋季招聘应聘的是Android,今年来到公司实习,要求做前端开发,所以一切只有现学,现在根据视频来学习,然后开这个博客记录一下自己的学习过程,废话不多说,开写. 4月6日 ...
- 前端新人学习笔记-------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 ...
随机推荐
- poj 1458 Common Subsequence_最长公共子串
题意:略 求最长公共子串 #include<iostream> #include<cstdio> #include<string> using namespace ...
- linux C之access函数 (20
http://blog.sina.com.cn/s/blog_6a1837e90100uh5d.html linux C之access函数 (20access():判断是否具有存取文件的权限 相关函数 ...
- iOS 创建上线证书
1.制作上线证书需要准备一个付费的账号(99$),登陆https://developer.apple.com在最上方的位置点击Member Center进入登陆界面,在登陆界面输入付费的账号和密码进入 ...
- 最少步数(dfs + bfs +bfs优化)
最少步数 时间限制:3000 ms | 内存限制:65535 KB 难度:4 描述 这有一个迷宫,有0~8行和0~8列: 1,1,1,1,1,1,1,1,1 1,0,0,1,0,0,1,0,1 ...
- autolisp 列表 resbuf
有以下 list : (1 2 3 (4 5 6) "Properties" (("id" . 3) ("name" . "hel ...
- 【收藏】十大Webserver漏洞扫描工具
如今有很多消息令我们感到Web的危急性,因此,当前怎样构建一个安全的Web环境成为网管员和安全管理员们义不容辞的责任.可是巧妇难为无米之炊,该选择哪些安全工具呢? 扫描程序能够在帮助造我们造就安全的W ...
- NHibernate各种数据库连接参数文件配置方法说明
//NHibernate各种数据库连接参数文件配置方法说明 //配置文件Config/Hibernate.cfg.xml内容如下所示: <?xml version="1.0" ...
- Permutations,Permutations II,Combinations
这是使用DFS来解数组类题的典型题目,像求子集,和为sum的k个数也是一个类型 解题步骤: 1:有哪些起点,例如,数组中的每个元素都有可能作为起点,那么用个for循环就可以了. 2:是否允许重复组合 ...
- A==?B(A,B超级大)
#include <iostream>#include <string.h>#include <cstring>using namespace std;struct ...
- nginx 禁止非指定域名访问
nginx 配置如下: server { listen 80 default_server; server_name _; return 404; } # server conf server { l ...