HTMl5
文章平均质量分 64
一喵呜
这个作者很懒,什么都没留下…
展开
-
【ibokan】HTMl常用标签复习总结笔记
------------------------------------------------------------1.网页框架基本结构块 2.布局结构块 标题 ---> 段落 列表结构块 有序 有序类型有:1,a,A,i,I 无原创 2014-02-20 19:26:51 · 916 阅读 · 1 评论 -
【ibokan】好的用户界面-界面设计的一些技巧
1 尽量使用单列而不是多列布局单列布局能够让对全局有更好的掌控。同时用户也可以一目了然内容。而多列而已则会有分散用户注意力的风险使你的主旨无法很好表达。最好的做法是用一个有逻辑的叙述来引导用户并且在文末给出你的操作按钮。 2 放出礼品往往更具诱惑力给用户一份精美小礼品这样的友好举动再好不过了。具体来讲,送出礼品也是之有效的获得客户忠诚度的战术,这是建立在人们互惠准则上的转载 2014-02-27 19:57:54 · 1384 阅读 · 0 评论 -
【ibokan】Sublime Text2 快捷键汇总
一个好的编辑器,能大大提高编程的效率。如果能熟知软件的快捷键,那更能让你得心印手。这些内容都是我网上和自己实际使用过程中所收集而来的,在网络上应该也算比较全面的了吧。欢迎大家补充,我也会在以后慢慢添加上来。插件使用方法:Ctrl+Shift+P 调用命令面板,我们就会找到一些以“Package Control:”开头的命令,我们常用到的就是几个 Install Package (安装扩展)转载 2014-02-27 12:09:29 · 961 阅读 · 0 评论 -
IE6 浏览器常见兼容问题 大汇总
以下全文载自独行冰海IE6以及各个浏览器常见兼容问题 大汇总综述:虽然说IE6在2014年4月将被停止支持,但是不得不说的是,IE6的市场并不会随着支持的停止而立刻消散下去,对于WEB前端开发工程师来说,兼容IE6 兼容各个浏览器,依然是不得不面对的工作。在此总结了常见的浏览器兼容问题,里面也有IE6的常见兼容问题,供大家分享。 如需转载,请注明出处:网转载 2014-03-12 09:32:51 · 4092 阅读 · 1 评论 -
【ibokan】DIV+CSS+PS实现背景图的三层嵌套以及背景图的合并
一、背景图合并: div+css+ps合图相结合的技术;通过精确到1px的css设置,使用ps合成背景图片,特别是小图片合并,来完成页面效果。 首先讲讲三层嵌套原理: ①要做成这个效果,用ps软件抠出这一栏目 ②继续抠图,截出三张这一的小图标,高度务必一样的大小,才原创 2014-03-07 14:06:28 · 6074 阅读 · 0 评论 -
img、png、gif图片区别详细辨析
之前做笔记的时候,觉得说的自己不理解明白,所以问了下,也大概清楚了。三种图片格式区别大概是这样的:PNGJPGGIF质量png-24质量最好png-8相对24的较差比png差质量最差透明度支持半透明,全透明,不透明格式图片支持不透明,半透明图片支持全透明,不透明图片兼容性pn原创 2014-03-13 20:49:57 · 10201 阅读 · 0 评论 -
【ibokan】a标签、hack以及透明度知识点
一、a标签link : 有链接属性时visited:链接地址已被访问过hover: 鼠标悬停在上面active:被用户激活(在鼠标点击与释放之间发生的事件)?问题一:# 跟### 区别?a {...} 权重为1a:visited 权重为11 (伪类为10+a的为1=11)a:hover权重也为11所以这样写的时原创 2014-03-10 10:57:22 · 2675 阅读 · 0 评论 -
行内元素与块级元素比较全面的区别和转换
载自:SyKent引言 一次偶然的面试遇到的题目,虽然当时知道块级元素和行内元素的区别,但是没有仔细去想。一、行内元素与块级元素块级元素列表定义地址定义表格标题定义列表中定义条目定义文档中的分区或节定义列表定转载 2014-03-10 12:09:00 · 1976 阅读 · 0 评论 -
innerHTML、outerHTML、innerText、outerText的区别及兼容性问题
看了很多文章关于, 关于innerHTML、outerHTML、innerText、outerText的区别,还是很模糊的一个印象,所以自己总结下这xie原创 2014-04-13 23:09:41 · 16500 阅读 · 0 评论 -
【ibokan】margin负值,一个秘密武器
本文载自一丝冰凉 一下为全文: CSS盒模型中,margin是我们老熟悉的一个属性了, 它的负值你用过吗? 你知道margin负值的秘密武器吗?我们一起看看吧!1、带竖线分隔的横向列表(例如:网站底部栏目)传统的分隔符是使用 “|” 来实现的,弊端显而易见,不利于表现与结构的分离,同时增加了后台输出时的判断工作。所以我们采用border-left 左边框来原创 2014-03-03 18:18:29 · 1124 阅读 · 0 评论 -
【ibokan】2014-2-18 作业
HTML5p{font-size: 24px;color: red;font-weight: bold;}此处书写注释-->了解:结构类、内容类、修饰类掌握:元素的呈现形式——块、行、其他块状元素:网页框架基本结构块:html、body*布局结构块:div*段落结构块:p*标题结构块:h1-h6原创 2014-02-19 18:45:30 · 934 阅读 · 0 评论 -
【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 前景色填充原创 2014-02-24 09:38:12 · 1660 阅读 · 0 评论 -
【ibokan】新浪博客等一些博客平台贴代码不显示问题解决方法
概 要新浪博客登陆 ☜百度空间登陆 ☜CSDN登陆 ☜针对这些日子来老师要我们每天写博看,分享自己的技术的时候,刚开始注册一个账号我想小学生都很成功都能顺利注册到,但是你也知道,写博客有时候要贴上一些技术代码给自己或者其他人看的时候,有些博客平台都是不怎么规范,就拿我之前一直在百度空间的时候,几乎天原创 2014-02-24 20:44:42 · 3274 阅读 · 1 评论 -
【ibokan】HTMl Meta的Exprise缓存策略
W3School中对于Meta的详细描述是这样的:定义和用法 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。 标签位于文档的头部,不包含任何内容。 标签的属性定义了与文档相关联的名称/值对。HTML 4.01 与 HTML 5 之间的差异在 HTML 5 中,不再支持 scheme 属性。在 HTML 5原创 2014-02-25 08:51:12 · 3003 阅读 · 0 评论 -
【ibokan】表单<Form>元素的一些简单实现代码
代码实现方式: New Document div{ width:35%;margin-left:32%;} 表单的注册 姓 名: 密 码: 邮 箱: 性 别:原创 2014-02-25 20:39:47 · 1460 阅读 · 1 评论 -
【ibokan】双飞翼布局实现代码
双飞翼布局是淘宝UED由国外圣杯布局优化而来的经典三栏布局解决方案,具有中栏html结构靠前且宽度自适应,侧栏宽度固定,且允许任何一栏为最高高度等优点。实现原理是先将中栏放好,然后让紧随其后的左右两栏利用margin负值强行挤到合适的位置。 .main,.left,.right{float: left;height:200px;} .ma原创 2014-02-25 20:24:16 · 1694 阅读 · 0 评论 -
【ibokan】background-position定位一张背景图
DIV背景定义参数:background 设置元素的背景参数,其中属性依次为 background-color(背景色) background-image(背景图) background-repeat(重复方式) background-position(背景图像位置) background-attachment(背景图像固定原创 2014-02-28 21:25:03 · 3462 阅读 · 0 评论 -
【ibokan】2014-2-18 HTMl中Post与get的区别
【登陆页面】每个登陆页面都是习以为常,今天也初次接触老师讲的知识点,自己也稍微了解系下,才慢慢熟悉HTML中post与get 的细微差别。我们在登陆SVNchina.com 的时候会出现这样一个登陆界面 New Document method="post"> 用户名: 密 码: method=“post”实现自制的网页登陆原创 2014-02-18 19:45:24 · 1303 阅读 · 0 评论 -
PNG的使用技巧—PC端中常用的Png格式是哪些?
Png是图像文件存储格式,在网页设计中已经不是一个陌生的名词,在前端开发中经常使用到它,如常用CSS 雪碧图。而Png的使用不仅仅如此,Png有多少种格式,有哪些特点,PC端中常用的Png格式是哪些,手机端最合适的Png格式是什么呢?如果你对这些问题有疑问,那么很开心的告诉你,这里有你需要的答案。 PNG的格式和透明度 这个Fireworks会比较清楚,打开Fireworkd优化面板,转载 2014-02-19 19:24:12 · 1284 阅读 · 0 评论 -
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原创 2014-03-19 22:03:01 · 2417 阅读 · 0 评论 -
HTML网页的浏览器标题栏显示小图标
就像这种效果,方法也很简单,就是, 在head里写:记得图标是.ico格式的文件,不然不会显示原创 2014-03-19 22:19:00 · 7664 阅读 · 0 评论 -
Sublime Text 3 插件用法以及详细快捷键操作 【2014-4-18再详细更新】
原创 2014-04-15 23:13:25 · 841 阅读 · 0 评论 -
项目期复习总结2:Table, DIV+CSS,标签嵌套规则
2014-5-12 晴 复习总结 ① 表格的意义,含义?表格应该用来展现那些适合表格化显示的信息,比如数据的显示,统计或者二维报表之类的信息,而不是作为一种而已的工作② 表格有哪些元素?表格元素:table thead tbody tfoot caption tr th td .... 较常用原创 2014-05-13 12:10:48 · 2810 阅读 · 0 评论 -
CSS动画属性性能
CSS动画属性会触发整个页面的重排relayout、重绘repaint、重组recompositePaint通常是其中最花费性能的,尽可能避免使用触发paint的CSS动画属性,这也是为什么我们推荐在CSS动画中使用webkit-transform: translateX(3em)的方案代替使用left: 3em,因为left会额外触发layout与paint,而webkit-transfor转载 2014-07-14 16:05:34 · 1376 阅读 · 0 评论 -
CSS3主要知识点复习总结+HTML5新增标签
分享2014-4-1 HTML5上课笔记2、CSS3属性(内核前缀)Mozilla 内核 css前缀-moz; WebKit 内核 css前缀-webkit ;(谷歌已换用blink内核)Opera 内核 css前缀 -o ; (欧朋已换用blink内核)Trident 内核 css前缀 -ms ;原创 2014-05-17 22:00:09 · 3543 阅读 · 2 评论 -
HTML 5 <input> placeholder 属性兼容性解决办法
跨浏览器placehoder body{ font:12px/1.5 'simsun';} form{ width:300px; height:260px; margin:20px auto 0;} h3{ font-weight:bold; margin:10px 0;}原创 2014-07-17 11:01:29 · 5492 阅读 · 1 评论 -
HTML5地理定位,百度地图API,知识点熟悉
判断浏览器的兼容问题:IE9+支持地理定位,FF Chrome新版支持地理定位 if (navigator.geolocation) { alert('支持地理定位'); } else { alert('不支持地理定位'); }获取自己位置经纬度 var x=d原创 2014-06-08 19:05:55 · 4170 阅读 · 0 评论 -
html5shiv.js分析
首先,我们先了解一下html5shiv.js是什么。html5shiv.js是一套实现让ie低版本等浏览器支持html5标签的解决方案。实现原理:见如何让ie低版本浏览器支持html5标签 。废话不多说,我们先上源代码,代码有点长,但保持原来的注释有利于大家理解,不想直接阅读的就点收缩代码然后往下看。源码原地址:https://github.com/aFarkas/html转载 2014-06-10 23:05:31 · 9090 阅读 · 2 评论 -
HTML5 Canvas知识点学习笔记
canvas ① 主要作用:绘制矢量图② 矢量图图形(路径)-(ILL) 位图图像(像素点)- PS中图像都是位图③ Canvas 能够制作动画,但是不是为了制作动画而生的也能够制作游戏。主要为了绘图而生。④ 能够设置宽高 推荐样式写在style;Canvas 相当于是一个绘制图形的容器,并没有绘制功能,需要借助JS(脚本)实现绘制功能原创 2014-06-11 21:22:19 · 2599 阅读 · 0 评论 -
HTML5中x-webkit-speech语音输入功能
现在各大网站都在搜索框中加入了语音输入功能,不过目前只有Chrome 11及以上版本才支持。可以用chrome浏览器在这里试试效果,点击话筒即可:实现起来也非常简单,为input添加名为 x-webkit-speech 的属性就行了。相关的属性设置:lang设置语言种类:onwebkitspeechchange语音输入事件,当发声语音改变转载 2014-06-01 16:08:05 · 9498 阅读 · 0 评论 -
项目期复习总结1:背景图合并,hack,浏览器内核前缀,伪类after before
1、背景图合并和CSS Spirit2、PS基本快捷键3、hack技术基本书写,为什么不用?4、内核前缀5、伪类afterbefore 1、背景图合并和CSS Spirit 背景图合并在使用时有两种方法:①一种就是你会PS,可以自己PS实现背景图合并成一张图片,再用background-position实现背景图的定位。②如果你不会PS,那可原创 2014-05-13 12:06:27 · 2260 阅读 · 0 评论 -
【htc法:IE-CSS3】CSS3支持IE6、IE7、IE8
【htc法:IE-CSS3】CSS3支持IE6、IE7、IE8摘要:IE-CSS3是提供一些CSS3标准新款式在即将到来的的Internet Explorer支持的脚本。IE-CSS3简介IE-CSS3是一种作用于IE浏览器的客户脚本,可以为一些CSS3支持度不好的低版本的IE浏览器(IE6、IE7和IE8)提供支持一些新的CSS3样式和标准。IE-CSS3的使用方转载 2014-05-16 11:31:36 · 3541 阅读 · 0 评论 -
DOM节点操作知识点简要总结
1、什么是DOM? Document Object Model (文档对象模型)DOM是针对文档的一个API接口 Dom描绘了一个层次化的节点树,允许开发人员添加,移除和修改页面的某一部分2、DOM树 ① 标签属于节点的一种 ② 节点包含了标签,注释,文本,doctype等在内的多种组合③ 在文档中出现的空格,回车,也属于节点原创 2014-05-01 13:37:22 · 1280 阅读 · 0 评论 -
HTML中的特殊符号
html中的特殊符号符号说明编码 符号说明编码 符号说明编码"双引号"×乘号×←向左箭头←&原创 2014-03-20 18:35:23 · 24386 阅读 · 6 评论 -
字符串的加密与解密
一、JavaScript预定义编码与解码方法字符串常规编码与解码——escape()和unescape() var str = 'HTML5 Free自由者'; str = escape(str); console.log(str); // HTML5%20Free%u81EA%u7531%u8005 str = u原创 2014-05-01 23:44:03 · 3505 阅读 · 0 评论 -
HTML5新增元素兼容旧浏览器的解决办法
一个问题,老师抛给我们的,就是:如何让IE8-兼容这些标签?(需要设计JS中的DOM)虽然今天刚讲的内容,但是,还是需要去了解下。 HTML5新增元素在旧浏览器的兼容-HTML5自由者 顶部区域 导航区域 文章区域 底部区域原创 2014-04-01 23:24:07 · 3536 阅读 · 1 评论 -
HTMl标签嵌套规则
body可以直接包含块状元素、ins、del、script。不可以直接包含行内元素ins和del(行内元素)可以包含块状元素或者行内元素,其他任何行内元素都不允许包含块状元素p、h1-h6可以直接包含行内元素和文本信息,但是不允许包含块状元素dl元素只允许包含dt和dd,同时dt不能包含块状元素,只允许包含行内元素,对于dd可以包含任何元素form元素不能够直接包含input元素。原因在于inpu转载 2014-03-26 20:48:13 · 1311 阅读 · 0 评论 -
Readonly和Disabled的区别
Readonly和Disabled它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonl转载 2014-03-26 22:19:19 · 1040 阅读 · 0 评论 -
HTMl5+CSS3 知识汇总【待更新整理...】
一、HTMl5的发展史1、HTML4.01 XHTML1.0 ----HTML5.0 谷歌苹果为首-并没有得到WC 的支持 W3C 当前推动HTML5.0的发展 新的网络标准2、跨平台 :桌端 手机端 系统:安卓-JAVA 、IOS-Object C 、 塞班、 WP 2011年HTM原创 2014-04-03 15:51:50 · 2803 阅读 · 0 评论 -
CSS3动画animation实现漂浮的云
实现的图像动画效果da原创 2014-04-09 22:56:41 · 10642 阅读 · 1 评论