HTMl5自由者

原创 Sublime Text 3 插件用法以及详细快捷键操作 【2014-4-18再详细更新】

原创 innerHTML、outerHTML、innerText、outerText的区别及兼容性问题

看了很多文章关于， 关于innerHTML、outerHTML、innerText、outerText的区别，还是很模糊的一个印象，所以自己总结下这xie

原创 CSS3动画animation实现漂浮的云

实现的图像动画效果da

原创 HTMl5+CSS3 知识汇总【待更新整理...】

一、HTMl5的发展史1、HTML4.01  XHTML1.0 ----HTML5.0 谷歌苹果为首-并没有得到WC 的支持       W3C   当前推动HTML5.0的发展    新的网络标准2、跨平台 ：桌端  手机端      系统：安卓-JAVA    、IOS-Object C  、 塞班、 WP      2011年HTM

原创 HTML5新增元素兼容旧浏览器的解决办法

一个问题，老师抛给我们的，就是：如何让IE8-兼容这些标签？（需要设计JS中的DOM）虽然今天刚讲的内容，但是，还是需要去了解下。 HTML5新增元素在旧浏览器的兼容-HTML5自由者 顶部区域 导航区域 文章区域 底部区域

转载 Readonly和Disabled的区别

Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别，总结如下：     Readonly只针对input(text / password)和textarea有效，而disabled对于所有的表单元素都有效，但是表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonl

转载 HTMl标签嵌套规则

body可以直接包含块状元素、ins、del、script。不可以直接包含行内元素ins和del（行内元素）可以包含块状元素或者行内元素，其他任何行内元素都不允许包含块状元素p、h1-h6可以直接包含行内元素和文本信息，但是不允许包含块状元素dl元素只允许包含dt和dd，同时dt不能包含块状元素，只允许包含行内元素，对于dd可以包含任何元素form元素不能够直接包含input元素。原因在于inpu

原创 HTML中的特殊符号

html中的特殊符号符号说明编码 符号说明编码 符号说明编码"双引号"×乘号×←向左箭头←&

原创 HTML网页的浏览器标题栏显示小图标

就像这种效果，方法也很简单，就是， 在head里写：记得图标是.ico格式的文件，不然不会显示

原创 CSS用text-overflow实现文本标题超出显示省略号“...”

语法：text-overflow:clip | ellipsisHTML5自由者 div.test{ white-space:nowrap; width:12em; overflow:hidden; border:1px solid #000;}The following two divs contains a long text that will not

原创 img、png、gif图片区别详细辨析

之前做笔记的时候，觉得说的自己不理解明白，所以问了下，也大概清楚了。三种图片格式区别大概是这样的：PNGJPGGIF质量png-24质量最好png-8相对24的较差比png差质量最差透明度支持半透明，全透明，不透明格式图片支持不透明，半透明图片支持全透明，不透明图片兼容性pn

原创 一张图，了解网站SEO方案

原图下载地址：http://pan.baidu.com/s/1mgqfzXu

转载 IE6 浏览器常见兼容问题 大汇总

以下全文载自独行冰海IE6以及各个浏览器常见兼容问题 大汇总综述：虽然说IE6在2014年4月将被停止支持，但是不得不说的是，IE6的市场并不会随着支持的停止而立刻消散下去，对于WEB前端开发工程师来说，兼容IE6 兼容各个浏览器，依然是不得不面对的工作。在此总结了常见的浏览器兼容问题，里面也有IE6的常见兼容问题，供大家分享。 如需转载，请注明出处：网

转载 行内元素与块级元素比较全面的区别和转换

载自：SyKent引言       一次偶然的面试遇到的题目，虽然当时知道块级元素和行内元素的区别，但是没有仔细去想。一、行内元素与块级元素块级元素列表定义地址定义表格标题定义列表中定义条目定义文档中的分区或节定义列表定

原创 【ibokan】a标签、hack以及透明度知识点

一、a标签link :  有链接属性时visited:链接地址已被访问过hover： 鼠标悬停在上面active：被用户激活（在鼠标点击与释放之间发生的事件）？问题一：# 跟### 区别？a {...}  权重为1a：visited 权重为11 （伪类为10+a的为1=11）a：hover权重也为11所以这样写的时

原创 【ibokan】DIV+CSS+PS实现背景图的三层嵌套以及背景图的合并

一、背景图合并：         div+css+ps合图相结合的技术；通过精确到1px的css设置，使用ps合成背景图片，特别是小图片合并，来完成页面效果。         首先讲讲三层嵌套原理：             ①要做成这个效果，用ps软件抠出这一栏目                    ②继续抠图，截出三张这一的小图标，高度务必一样的大小，才

原创 【IE6 Bug】样式中文注释后引发失效

触发原因：1、HTML页面编码与CSS编码不同（DEMO中HTML为gbk，CSS为utf-8）2、CSS文件中未指定@charset头声明，导致IE默认使用页面编码来解码CSS文件3、当中文注释字数为奇数时，会与结尾的 “*/” 组合成新的合法字符，致使注释未能关闭，紧跟其后的样式被注释失效。解决方案：　　1、在中文注释右侧加空格，例如 /*前端开发*/改为/*前端开

原创 【IE6 Bug】浏览器默认属性初始化，也算是Bug

这也算不上什么Bug，但是也加入IE6 Bug目录中，方便以后查看。很多浏览器都默认初始默边框，间距或者其他标签属性，为了合理兼容各个浏览器，必须引入初始化文件reset.css文件。当然，初始化样式会对SEO有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。最简单的初始化方法就是： * {padding: 0; margin: 0;}。有很多人也是这样写的。这确实很简单，但

原创 【IE6 Bug】IE6的怪异解析模式

IE6的怪异解析模式：只在IE6下出现。      触发方法：没有文档声明 ，文档正确定义了DOCTYPE浏览器则会进入标准模式（Standards Mode），否则浏览器会进入怪异模式或混杂模式（Quirks mode）。      触发现象：合模型的实际宽度和高度等于内容区域和外边距的和，内边距和边框的宽高计算到内容中      规避方式：规范书写文档声明

原创 【IE6 Bug】margin双倍边距Bug的处理办法

出现IE6双倍边距Bug触发的几个条件：       ①：是块元素；       ②：有左浮动；       ③：有左外边距。解决办法：把相应的块元素转为内联元素，在相应的块元素中加入css代码，display：inline；[代码]：         IE6下的双倍Bug解决方法 .div1 { height: 200px;

原创 【ibokan】SEO个人笔记+百度百科详细介绍

百度百科的详细解释：点击链接SEO（Search Engine Optimization），汉译为搜索引擎优化。seo搜索引擎优化是一种利用搜索引擎的搜索规则来提高目前网站在有关搜索引擎内的排名的方式。SEO目的理解是：为网站提供生态式的自我营销解决方案，让网站在行业内占据领先地位，从而获得品牌收益。SEO包含站外SEO和站内SEO两方面。中

原创 【ibokan】margin负值，一个秘密武器

本文载自一丝冰凉  一下为全文： CSS盒模型中，margin是我们老熟悉的一个属性了， 它的负值你用过吗？ 你知道margin负值的秘密武器吗？我们一起看看吧！1、带竖线分隔的横向列表（例如：网站底部栏目）传统的分隔符是使用 “|” 来实现的，弊端显而易见，不利于表现与结构的分离，同时增加了后台输出时的判断工作。所以我们采用border-left 左边框来

原创 【ibokan】background-position定位一张背景图

DIV背景定义参数：background 设置元素的背景参数，其中属性依次为     background-color(背景色)     background-image(背景图)     background-repeat(重复方式)      background-position(背景图像位置)     background-attachment(背景图像固定

转载 【ibokan】好的用户界面-界面设计的一些技巧

1 尽量使用单列而不是多列布局单列布局能够让对全局有更好的掌控。同时用户也可以一目了然内容。而多列而已则会有分散用户注意力的风险使你的主旨无法很好表达。最好的做法是用一个有逻辑的叙述来引导用户并且在文末给出你的操作按钮。 2 放出礼品往往更具诱惑力给用户一份精美小礼品这样的友好举动再好不过了。具体来讲，送出礼品也是之有效的获得客户忠诚度的战术，这是建立在人们互惠准则上的

转载 【ibokan】Sublime Text2 快捷键汇总

一个好的编辑器，能大大提高编程的效率。如果能熟知软件的快捷键，那更能让你得心印手。这些内容都是我网上和自己实际使用过程中所收集而来的，在网络上应该也算比较全面的了吧。欢迎大家补充，我也会在以后慢慢添加上来。插件使用方法：Ctrl+Shift+P 调用命令面板，我们就会找到一些以“Package Control:”开头的命令，我们常用到的就是几个 Install Package (安装扩展)

原创 【ibokan】表单<Form>元素的一些简单实现代码

代码实现方式：   New Document div{ width:35%;margin-left:32%;} 表单的注册 姓 名： 密 码： 邮 箱： 性 别：

原创 【ibokan】双飞翼布局实现代码

双飞翼布局是淘宝UED由国外圣杯布局优化而来的经典三栏布局解决方案，具有中栏html结构靠前且宽度自适应，侧栏宽度固定，且允许任何一栏为最高高度等优点。实现原理是先将中栏放好，然后让紧随其后的左右两栏利用margin负值强行挤到合适的位置。        .main,.left,.right{float: left;height:200px;} .ma

原创 【ibokan】HTMl Meta的Exprise缓存策略

W3School中对于Meta的详细描述是这样的：定义和用法 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。 标签位于文档的头部，不包含任何内容。 标签的属性定义了与文档相关联的名称/值对。HTML 4.01 与 HTML 5 之间的差异在 HTML 5 中，不再支持 scheme 属性。在 HTML 5

原创 【ibokan】新浪博客等一些博客平台贴代码不显示问题解决方法

概 要新浪博客登陆 ☜百度空间登陆 ☜CSDN登陆     ☜针对这些日子来老师要我们每天写博看，分享自己的技术的时候，刚开始注册一个账号我想小学生都很成功都能顺利注册到，但是你也知道，写博客有时候要贴上一些技术代码给自己或者其他人看的时候，有些博客平台都是不怎么规范，就拿我之前一直在百度空间的时候，几乎天

原创 【ibokan】PS常用快捷键

ctrl+shift+alt+s 快捷键 存储为Web格式前景色 背景色ctrl+w 关闭ctrl+r 标尺 右键标尺选像素或者厘米 左键点击拉出标尺线 要删掉直接拖出去ctrl+ + 放大ctrl+ -缩小 ctrl+1 到100%视图ctrl+0 还原到最佳视图 ctrl+d取消选区ctrl+t 变形 在变形过程中按住shift保持宽高不变 按Enter退出变形Alt+Delete 前景色填充

原创 【ibokan】HTMl常用标签复习总结笔记

------------------------------------------------------------1.网页框架基本结构块    2.布局结构块    标题 --->    段落      列表结构块    有序                 有序类型有：1，a，A，i，I    无

转载 PNG的使用技巧—PC端中常用的Png格式是哪些？

Png是图像文件存储格式，在网页设计中已经不是一个陌生的名词，在前端开发中经常使用到它，如常用CSS 雪碧图。而Png的使用不仅仅如此，Png有多少种格式，有哪些特点，PC端中常用的Png格式是哪些，手机端最合适的Png格式是什么呢?如果你对这些问题有疑问，那么很开心的告诉你，这里有你需要的答案。　　PNG的格式和透明度　　这个Fireworks会比较清楚，打开Fireworkd优化面板，

原创 【ibokan】2014-2-18 作业

HTML5p{font-size: 24px;color: red;font-weight: bold;}此处书写注释-->了解：结构类、内容类、修饰类掌握：元素的呈现形式——块、行、其他块状元素：网页框架基本结构块：html、body*布局结构块：div*段落结构块：p*标题结构块：h1-h6

原创 【ibokan】2014-2-18 HTMl中Post与get的区别

【登陆页面】每个登陆页面都是习以为常，今天也初次接触老师讲的知识点，自己也稍微了解系下，才慢慢熟悉HTML中post与get 的细微差别。我们在登陆SVNchina.com 的时候会出现这样一个登陆界面 New Document method="post"> 用户名： 密 码： method=“post”实现自制的网页登陆