HTML5语义元素2

之前记录了一些与页面结构有关的语义元素,articleasidefigurefigcaptionfooterheaderhgroupnavsection。除了这些之外还有一些其他的一些语义元素.

使用time元素标注时间和日期

计算机能看懂的日期格式为YYYY-MM-DD

1
Today is <time datetime="2013-06-04">2013.06.04</time>

显示为:

Today is

标注日期的格式为HH:MM+00:00,前两位表示小时,接着两位表示分钟,然后是一个加号,后面的是时区。要表示北京时间晚上七点半的话:

1
The party starts at <time datetime="19:30+8:00">7:30 pm.</time>

显示为:

The party starts at

也可以吧上面两个合在一起,在日期和时间之间使用T连接。

1
The party starts at <time datetime="2013-06-04T19:30+8:00">June 4<sup>th</sup> at 7:30 pm.</time>

显示为:

The party starts at

Read on →

NEET第一周总结

刚离职滚回家开始NEET的生活,电脑就出问题了,自己拆了几次没修好,拿去给隔壁检测,发现主板bios乱了,刷不回来,于是要换主板,顺便把cpu也换了,果断上E3,想换好久了,只是电脑没坏的话一直不舍得,不过现在没收入了倒真坏得不是时候。

Read on →

HTML5语义元素1

HTML5增加了很多语义元素,虽然大部分在视觉没什么区别,但能使网页结构更加清晰。

header标注页眉,footer标注页脚,article表示一个完整的内容快。通常存放博客或者新闻内容。用hgroup标注副标题。使用figure元素添加插图,图题放在figure中的figcaption里面。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<article>
  <header class="header">
      <hgroup>
          <h1>How the World Could End<h1>
          <h2>Scenarios that spell the end of life as we know</h2>
      </hgroup>
      <p class="Byline">by Ray N.</p>
  </header>
  <div class="content">
      <p><span>Right now</span>, you're probably...</p>
      <p>....</p>
      <figure class="floatFigure">
          <img src="/nyan.jpg">
          <figcaption>NyanNyanNyanNyanNyanNyan</figcaption>
      </figure>
      <h2>Mayan Doomsday</h2>
      <p>....</p>
      ....
  </div>
  <footer class="footer">
      <p class="Disclaimer">...</p>
      ...
  </footer>
</article>

aside元素表示与它周围文本没有密切关系的内容。通常用于附注栏,放一些广告或者其他一些相关的话题。

使用nav标注导航链接,区块元素section定位有些模糊,感觉跟div差不多,暂时不管了。

PS:发现写一些html元素时带括号的话有时会导致blog的css乱了,如这里的figure元素@_@

无题1

上班时候上V2EX划水,偶然看到这:问攻城师:有没有比较不错的前端开发培训的

在家里断断续续学完了HTML,然后就不能继续下去了,家里天天吵着要我去工作,不要在家这么玩,我能跟父母说什么?他们一直瞧不起我,哎不说了,求攻城师推荐下,年纪起来越大了,一直在工地,或者工厂上班,没任何谋生技能,现在真心意识到没技能在外面好苦哇!!!!!

中了不少枪=。=

Read on →

这是个悲伤的故事

这是5月19号开的坑,没写完又要跑去上班没来得及post出来,结果又要等一个礼拜才能完成。

17号晚上回家就在台机上装了个Ubuntu13.04,然后配置各种软件,搞一些配置,直接把星期六的时间也花掉了,当然期间切回到windows8跟阿坚撸了几次dota,真是死不悔改=。=

本来打算把家里台机当娱乐机放家里,放假回来玩下游戏,看下动画什么的,笔电就装个linux学习用,没想到现在又要在台机上搞双系统。原因要说到13号咱的ThinkPad E530被偷了。搞到现在只能在周末回家撸一下台式机了(跪…

写这篇文主要也是为了悼念一下我的笔电。

Read on →

Sublime Text,又一个编辑利器

Sublime是个跨平台文本编辑器,有丰富的插件支持,在Linux和windows下都有很好的表现。界面很好看,尤其右边的缩略图在看打文件时实在美爆了>_<。而且Sublime在使用zencode的时候能看实时效果。看过Lucifr大大的一些介绍之后更是觉得碉堡。

可以在官网下载,直接解压可用。

也可以添加ppa源安装

sudo add-apt-repository ppa:webupd8team/sublime-text-2
sudo apt-get update
sudo apt-get install sublime-text

安装Package Control,ctrl+`打开控制台,输入

import urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp) if not os.path.exists(ipp) else None;open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read())

然后可以通过Package Control方便地安装插件了。 更多有趣的使用方法可以参考Lucifr的博文.

收集的一些Unity工具栏小插件

最近越来越喜欢Unity了,于是找了一些工具栏小插件。

Read on →

Ubuntu软件推荐

相比Mac和Windows两个平台,Linux下的软件境况真是比较难看了,但也不乏一些比较好用的软件。

Audacious

Audacious是一款音乐播放软件,对中文支持比较不错,支持GKB等中文编码,支持ape,flac,界面简洁。

Read on →

剖析.desktop文件

.desktop文件由Freedesktop.org维护,在Gnome,KDE,LXDE,XFCE这些X环境中通用。

.desktop文件有两个主要功能,一个是让程序显示在菜单里面,这需要把.desktop文件放在/usr/share/applications/里面,有些特殊情况会放在$HOME/.local/applications/里面,另一个功能是让程序显示在桌面,需要把.desktop文件放在$HOME/Desktop里面。

.desktop文件的内容按照一个key对应一个value的格式书写:key=value

Read on →

Unbuntu下安装firefox的flash插件

firefox的flash插件总是很奇葩地自动安装失败,于是从Adobe下载flash插件,解压

sudo cp -r usr/* /usr
sudo cp libflashplayer.so /usr/lib/mozilla/plugins

_(:3」∠)_以上,纯粹笔记记下firefox的插件路径。