mtdyxsp-CSDN博客

转载 block，inline和inline-block概念和区别

总体概念block和inline这两个概念是简略的说法，完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素)。block元素通常被现实为独立的一块，会单独换一行；inline元素则前后不会产生换行，一系列inline元素都在一行内显示，直到该行排满。大体来说HTML元素各有其自身的布局级别（block元素还是inlin

2016-08-21 11:21:25 311

原创 border:medium none，

今天发现一个样式属性从来没有用过，它就是 border:medium none，就是不显示边框。BORDER: medium none; 不显示边框medium是边框宽度的默认值

2016-08-19 11:32:49 1393

转载 css中的background:transparent的作用

：有时大家在看css时,看到有的css属性定义为background:transparent。意思就是背景透明。实际上background默认的颜色就是透明的属性。例如如果一个元素覆盖在另外一个元素之上，而你想显示下面的元素，这时你就需要把上面这个元素的background设置transparent。下面介绍css中的background:transparent的作用一、backgroun

2016-08-19 11:28:15 1032

转载 data类型的Url

所谓"data"类型的Url格式，是在RFC2397中提出的，目的对于一些“小”的数据，可以在网页中直接嵌入，而不是从外部文件载入。例如对于img这个Tag，哪怕这个图片非常非常的小，小到只有一个点，也是要从另外一个外部的图片文件例如gif文件中读入的，如果浏览器实现了data类型的Url格式，这个文件就可以直接从页面文件内部读入了。data类型的Url格式早在1998年就提出了，时至今日

2016-08-17 21:35:11 460

原创九九乘法表挺好玩的

今天看了麦子学院的javascript课程，老师留了作业，写反过来的九九乘法表。我发现挺好玩的，突然想到了两种办法，当然老师的本意可能是用第二种办法，作为一个初学者，之前没接触过，我还是比较开窍的。记录下来，以后可以留做纪念，第一次让自己激动的小程序。老师写的： document.write(''); document.write('');

2016-08-14 21:36:18 416

转载 <meta http-equiv="X-UA-Compatible" content="IE=edge">

Starter Template for Bootstrap Toggle navigation

2016-08-13 11:08:55 1603

转载前端同学大福利，最全的面试题目整理

1、常用那几种浏览器测试？有哪些内核(Layout Engine)?(Q1) 浏览器：IE，Chrome，FireFox，Safari，Opera。(Q2) 内核：Trident，Gecko，Presto，Webkit。2、说下行内元素和块级元素的区别？行内块元素的兼容性使用？（IE8 以下）(Q1) 行内元素：会在水平

2016-08-12 09:08:52 335

做前端多年，虽然不是经常需要hack，但是我们经常会遇到各浏览器表现不一致的情况。基于此，某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现。我个人是不太推荐使用hack的，要知道一名好的前端，要尽可能不使用hack的情况下实现需求，做到较好的用户体验。可是啊，现实太残酷，浏览器厂商之间历史遗留的问题让我们在目标需求下不得不向hack妥协，虽然这只是个别情况。今天，结合自己的经

2016-08-09 10:49:19 188

转载 block（块级元素）和 inline（内联元素）的区别

div这样的块级元素，就会自动占据一定矩形空间，可以通过设置高度、宽度、内外边距等属性，来调整的这个矩形的样子；与之相反，像“span”这样的行内元素，则没有自己的独立空间，它是依附于其他块级元素存在的，因此，对行内元素设置高度、宽度、内外边距等属性，都是无效的。其实你需要知道的行内元素就是 span 和 a ，其他的行内元素，比如 strong、b、font

2016-08-05 13:09:16 306

原创导航部分第一个li错位的问题

今天学习慕课网企业实战项目的时候发现了导航部分第一个li错位的问题，如图源码：HTML： index 联系我们加入收藏设为首页

2016-08-05 12:51:24 1330 1

原创理解两个元素垂直居中对齐

在慕课网跟着企业网站实例进行练习，logo区的电话图标和后面的电话号码对齐用了一个vertical-align:middle,前段时间练习没有见过。查了W3C是这样解释的：vertical-align 属性设置元素的垂直对齐方式。该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中，这个属性会设置单元格框中的单元格内

2016-08-05 10:19:38 2585

转载 CSS中常用的四种链接状态：a:link、a:visited、a:hover及a:active

CSS 链接不同的链接可以有不同的样式。链接样式链接的样式，可以用任何CSS属性（如颜色，字体，背景等）。特别的链接，可以有不同的样式，这取决于他们是什么状态。这四个链接状态是：a:link - 正常，未访问过的链接a:visited - 用户已访问过的链接a:hover - 当用户鼠标放在链接上时a:active - 链接被点击的那一刻实例

2016-08-04 21:25:48 19715

原创设为首页、加入收藏及保存到桌面的JS代码

在网上找了一段设为首页、收藏本站及保存到桌面的js代码，先存下来，然后再好好研究。复制代码代码如下://设为首页function SetHome(obj,url){ try{ obj.style.behavior='url(#default#homepage)'; obj.setHomePage(url);

2016-08-04 20:54:43 5209

转载常用的清除浮动的方法

此为未清除浮动源代码，运行代码无法查看到父级元素浅黄色背景。–*{margin:0;padding:0;}body{font:36px bold; color:#F00; text-align:center;}#layout{background:#FF9;}#left{float:left;width:20%;height:200px;background:#DDD;lin

2016-08-04 17:32:22 255

转载 JavaScript调试技巧之console.log()详解

对于JavaScript程序的调试，相比于alert()，使用console.log()是一种更好的方式，原因在于：alert()函数会阻断JavaScript程序的执行，从而造成副作用；而console.log()仅在控制台中打印相关信息，因此不会造成类似的顾虑。一、什么是console.log()？除了一些很老版本的浏览器，现今大多数浏览器都自带调试功能；即使没有调试功能，也可以通

2016-07-31 19:30:23 1206

原创今天发现了css中的一个顺序问题

这几天正在自学中。。。今天发现一个顺序的问题，之前自学的时候没有看过谁讲这个问题。这个demo是关于轮播图的HTML Title < > 1 2 3 4 5 6

2016-07-28 15:53:51 377

转载 CSS3 RGBA 属性高级用法

讲一下CSS3里目前用的比较广的RGBA属性的高级使用方法。这个属性的兼容问题比较简单，IE8已经支持这个属性，IE6和IE7也可以通过 hack支持。RGBA和CSS2里的RBG属性差不多，只是RGBA属性多了一个透明度的定义，CSS3标准里对RGBA属性的解释如下：/* 基本语法 */em { color: Rgba(red,green,blue,opacity

2016-07-27 17:55:18 802

原创修改WebStorm默认保存的文件编码格式

File > Settings > Editor > File Encodings 把 IDE Encoding 和 Project Encoding 都改成 UTF-8

2016-07-21 16:23:32 1999

原创 webstorm添加电脑上其他盘里面的文件

步骤：File->Setting 打开设置面板，打开Directories节点，然后看到有Add Content Root（添加根目录）操作选项，单击弹出磁盘目录文件，选择对应项目或者目录即可。

2016-07-21 15:41:54 977

转载获取scrollTop兼容各浏览器的方法，以及body和documentElement是啥？

1、各浏览器下 scrollTop的差异 IE6/7/8：对于没有doctype声明的页面里可以使用 document.body.scrollTop 来获取 scrollTop高度；对于有doctype声明的页面则可以使用 document.documentElement.scrollTop； Safari: safari 比较特别，有自己获取scrollTop的函数

2016-07-15 17:44:37 247

转载 html中offsetTop、clientTop、scrollTop、offsetTop各属性介绍

HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度。 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度 offs

2016-07-15 17:30:26 231

转载前端开发人员必须了解的七大技能图谱（别人写的收集起来）

网上学习资源参差不齐、分散无系统，给爱学习、努力想提高的你是不是造成很多困扰呢？与其他学习平台不同，CSDN知识库不是随机地、一股脑地向您推算大量文章，而是首先梳理各技术领域知识图谱，再以此为基础，收集、筛选出每个技术分支所涉及的各个技术点的解析类、动手实践类文章，内容更系统化、更有针对性。无论您正关注哪个技术领域，这里都可以找到你所需要的。（如果没找到您所需要的，欢迎向我们反馈，我们不会让您等

2016-07-14 18:47:18 520

原创 webstorm光标变黑块

由于光标是在使用中突然发生变化，推测是碰到了快捷键，因此断定有快捷键可以修改。后来，无意中碰到了“Insert”键，于是光标立即发生了变化，“黑块矩形”变成“小竖线”。由此知道，insert键可以使光标在“小竖线”和“黑块矩形”间快速变换。

2016-07-14 18:43:58 12992 7

原创数组相关基础学习

从数组头部或者尾部添加或删除元素push 尾部添加一个元素pop 尾部删除一个元素shfit 头部删除一个元素unshift 头部添加一个元素从数组中间或者尾部添加或删除元素splice 删除splice(起点，长度)splice 插入splice(起点，0，‘元素1’，‘元素2’，‘元素3’)

2016-07-11 10:58:33 259

原创解决不同浏览器下获取样式的兼容性问题

今天学习了获取行间样式和非行间样式，解决不同浏览器的兼容性问题，很多兼容性问题都可以通过if(){}else{}解决html lang="en">head> meta charset="UTF-8"> title>qufeihangjianyangshititle> style> #div1 {

2016-07-11 10:15:58 285

mtdyxsplzm的博客