轩枫阁

首页 / Web前端 / HTML (第2页)

HTML中常用meta整理

< meta > 元素

定义

meta标签提供关于HTML文档的元数据。元数据不会显示在页面上,但是对于机器是可读的。它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 web 服务。 —— W3School

必要属性

属性 描述
content some text 定义与http-equiv或name属性相关的元信息

查看全文

2014/12 14  周日

基于Canvas实现的炫酷3D动画大背景

前言

HTML5 中新增标签Canvas,Canvas 对象表示一个 HTML 画布元素 -<canvas>。它没有自己的行为,但是定义了一个 API 支持脚本化客户端绘图操作。利用JS,可以实现一些超炫酷的效果。本文所介绍的是基于Canvas实现的炫酷3D动画大背景。

案例一

原版

QQ 官网 http://im.qq.com/pcqq/

demo

http://xuanfengge.com/demo/201411/vector/demo1.html

使用

为方便大家使用,轩枫阁已将主体代码抽出,并示范使用方法(具体看源码),只需加载相关JS并调用即可。不依赖jQery,但是需注意代码执行顺序。

特点

改变3D大背景块颜色,清晰可见,适用于文字较少、加以配图的页面。 查看全文

2014/11 15  周六

Markdown标记语言的用处

markdown是为哪些使用者设计的

首先要确定是否真的需要markdown,使用某种工具是为了提高效率或者某种体验的,如果这种工具并不能显著帮你改善体验,那就让它见鬼去吧,哪怕这个工具学起来很简单。

markdown是为那些需要经常码字或者进行文字排版的、对码字手速排版顺畅度有要求的人群设计的,他们希望用键盘把文字内容啪啪啪地打出来后就已经排版好了,最好从头到尾都不要使用鼠标。这些人包括经常需要写文档的码农、博客写手、网站小编、出版业人士等等。

通常情况下,网络上需要进行大量文字输入的地方都可以通过所见即所得的方式排版(比如知乎的答案编辑模式),本地写作的话则可以使用word这类常用的文本编辑软件,当然你也可以蛋疼地手工使用html标签实现排版效果——而markdown只是使这一切更方便了一点而已,所以如果你觉得现有文本编辑方式完全够用了,就别费神折腾了(除非你在使用像github这样markdown作为主流编辑方式的网站)。

Markdown还可以用在以下场景

  • 需维护型文档:文档需要在多平台使用,如wiki平台、同事传阅、网站发布等。一般文档常用Word来写,但是如果文档一需要在网上发布就麻烦了,格式没有跟过来。如果一开始就是markdown语法,可以通用解决。
  • 项目文档:项目文档一般都是用md来写的,github的项目的Readme.md就是markdown文档
  • wordpress博客:当然WP有自己的编辑器,如果你想用markdown还是可以的,装插件(后面会介绍)即可
  • 创意简历:还有一种装逼手段就是用markdown来编写简历,那绝对是创意来着的哦,适合程序员
  • 更多:管理所有的文本创作和笔记、建立自己的知识库、写博客日记、写技术文献、做ppt

markdown语法

如果决定使用markdown了,那就先快速学习一下它的语法吧。markdown语法很少很简单,可以参照下面两个链接中的简明版,然后在这个在线的markdown-html在线转换上(Daring Fireball: Markdown Web Dingus)操练操练,不用一个小时就可以掌握。

简明版 Markdown 语法说明(简体中文版)

完整版 Markdown 语法说明(简体中文版) 查看全文

2014/10 26  周日

HTML5程序员的浪漫爱心表白动画

简介

我们程序员在追求爱情方面也是非常浪漫的,某位同学利用自己所学的HTML5知识自制的HTML5爱心表白动画,画面非常温馨甜蜜,这样的创意很容易打动女孩,如果你是单身的程序员,也赶紧来制作自己的爱心表白动画吧。

在线演示

http://xuanfengge.com/demo/201409/love/

程序源码

https://github.com/xuanfeng/HTML5-love-you
查看全文

2014/10 12  周日

HTML5移动端数据图表组件调研

chart.js

技术:基于HTML5 canvas

文档:英文(http://www.chartjs.org)、中文(http://www.bootcss.com/p/chart.js

类型:6种图表类型(折线图,条形图,雷达图,饼图,柱状图和极地区域区)

量级:独立包,不依赖第三方 JavaScript 库,小于 5KB

大小:Chart.min.js-50.201 kb

特性:颜色,字体,边框和它们的尺寸都可以定制,图表可以动画的形式加载,非常炫

兼容:支持canvas的所有现代浏览器和大部分手机浏览器,自动针对retina屏幕做缩放

其他:图表如果使用动画效果,在PC端流畅,但是在移动端效果产生抖动延迟现象;如果不使用动画效果在移动端则正常显示

推荐指数:★★★★☆ 查看全文

2014/08 02  周六

纸飞机许愿

x

钢琴节奏

请选择弹奏的曲谱

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 1
    • 2

    [返回曲谱列表]

    点击开始录制,可以录制弹奏的曲子