Quantcast
Channel: HTML –静觅
Browsing all 13 articles
Browse latest View live

Image may be NSFW.
Clik here to view.

HTML5定稿了,为什么原生App世界将被颠覆

摘要:2014年10月底,HTML5规范正式定稿,结束了长达8年的长跑。数字天堂董事长,DCloud CEO王安梳理了HTML5诞生至今的演变过程,并从开发者和用户两个角度分析了HTML对两个人群的优势。 2007年W3C(万维网联盟)立项HTML5,直至2014年10月底,这个长达八年的规范终于正式封稿。...

View Article



HTML5视频教程

关于HTML5 万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改。 2014年10月29日,万维网联盟宣布,经过几乎8年的艰辛努力,该标准规范终于最终制定完成。 在此提供HTML5视频教程。 视频来源:兄弟连教育 感谢 @兄弟连教育 关于兄弟连 兄弟连成立于2006年,专注于IT技术培训,是国内最早及最大的PHP/LAMP技术专业培训学校。...

View Article

利用响应式布局搭建自己的个人简介网站(CV)

之前一直想搭建一个个人CV,用来展示自己的详情,技能树,项目经历等等。从网上看了许多模板,发现扁平化设计的单页模板非常适合,不过下载了几个之后,直接拿来修改用了感觉没有什么可以学到的东西,现在扁平化趋势这么流行,加上网页的响应式布局也越来越火,何不自己尝试一把?...

View Article

Image may be NSFW.
Clik here to view.

纯CSS3实现微信二维码动态呈现

综述 原创内容,纯 CSS3 实现微信扫一扫的功能,页面一共五个二维码,鼠标移上二维码会自动放大,同时支持响应式布局,整体会根据页面响应式缩放。 在我的个人网站赞助页面即存在这个 DEMO 进入页面 截图 1.正常情况,大屏幕 2.鼠标移上,大屏幕 3.小屏幕 在线演示 在线演示 源码下载 源码下载 转载请注明:静觅 » 纯CSS3实现微信二维码动态呈现

View Article

Image may be NSFW.
Clik here to view.

HTML5实现2048网页游戏

综述 改编内容,HTML5实现2048游戏的开发,添加了小屏幕适配,支持手机端触控。 截图 1.电脑端 2.平板端 3.手机端 在线演示 在线演示 源码下载 源码下载 转载请注明:静觅 » HTML5实现2048网页游戏

View Article


Image may be NSFW.
Clik here to view.

HTML5实现响应式进度条及分享图标

综述 纯原创内容,HTML5实现个人简介界面,响应式布局的进度条以及利用Font-Awesome实现分享图标,完美支持手机端。 已经在博主个人网站应用 进入页面 截图 1.电脑端   2.手机端   在线演示 在线演示 源码下载 源码下载 转载请注明:静觅 » HTML5实现响应式进度条及分享图标

View Article

Image may be NSFW.
Clik here to view.

使用CSS3自定义网页字体的方法

综述 CSS3已经变得非常流行,原本的CSS不支持自定义字体,但是传说中的CSS3基本上什么都可以,那么CSS3中可不可以自定义英文字体呢?这里我们就一起来感受一下。 语法规则 @font-face {   font-family: 自定义的字体名称;   src: 自定义的字体的存放路径;   font-weight: normal;是否为粗体   font-style:...

View Article

Image may be NSFW.
Clik here to view.

几款优秀的前端UI框架

目前响应式布局和扁平化越来越风靡,前端UI框架也是风生水起,在这里分享几款优秀的前端UI框架 BootStrap 相比这个大家都听说过吧,Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。 官网链接 中文链接 Foundation...

View Article


LESS学习记录

综述 LESS 包含一套自定义的语法及一个解析器,用户根据这些语法定义自己的样式规则,这些规则最终会通过解析器,编译生成对应的 CSS 文件。LESS 并没有裁剪 CSS 原有的特性,更不是用来取代 CSS 的,而是在现有 CSS 语法的基础上,为 CSS 加入程序式语言的特性。 本文部分内容参考 官方文档 编译器 建议使用Koala编译器 下载地址 LESS 原理及使用方式 本质上,LESS...

View Article


Image may be NSFW.
Clik here to view.

HTML5中Device Orientation的特性

HTML5中包含一个帮助检测device orientation的特性,使用这个特性可以在移动设备浏览器中判断用户设备的旋转重力方向。 基本知识 Alpha, Beta, Gamma角度旋转。 当用户旋转手机的时候,HTML5中定义了三个轴方向的旋转,如下: 上图可以看考,分别是z,x,y轴,对应分别是:Alpha,Beta,Gamma,下面图将更清楚的展示: 上图是Alpha旋转,...

View Article

Image may be NSFW.
Clik here to view.

关于HTML内联元素一侧留白的浅谈

问题来源 在写代码的时候遇到了如下问题: 使用了bootstrap框架来编写了一个页面,其中input元素两侧留有空白。然而用JS动态添加的同样的元素却不会出现这种情况。具体截图表现如下: 我们可以发现,第一行和而三行的代码是完全一样的,可是呈现的结果是截然不同的。 在线测试样例 大家是不是觉得很奇怪?没错,我也是。中间的那个缝隙是哪里来的呢? 刨根问底 在这里感谢 wonder...

View Article

Image may be NSFW.
Clik here to view.

BootStrap4提取并编译Flexbox Grid系统

前言 首先Flexbox是什么?它是Bootstrap4新出的一个布局格式,对移动端开发非常方便。...

View Article

利用Sass自动生成padding和margin边距样式

需求分析 有需求才有动力! 写CSS的时候,你经常会遇到要设置一个小边距,比如设置: 所有内边距10px,外左边距20px,内右边距0,上下内边距50px,外左右边距自动…. 而你是不是又不想自己单独为它们定义一个class,然后把padding, margin之类的写进去? 举例如下: 现在我有两个p标签,我想让这两个p标签中间相隔10px,那是不是需要?<p...

View Article

Browsing all 13 articles
Browse latest View live




Latest Images