预览模式: 普通 | 列表

对页面制作的一些建议

  现在,对于页面制作(估计每家公司的叫法都不大一样)这个职位,职责已经逐渐清晰了,通常需要负责的环节就是“还原效果图”,也就是将设计稿做成HTML页面。

  不过在这个还原的过程中应该也是需要一些基本的流程和注意一些东西的。

  1、我们在拿到设计图后,通常会怎样做呢?

   或许我们会在拿到图后二话不说,直接对着效果图,将代码从头敲到脚?

查看更多...

分类:(X)HTML | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 65

不给line-height加单位要成为一种习惯

  好久都没有更新Blog了,最近懒了不少。

  我们都知道line-height是可以继承的,由于这个特性,子元素就可以不用重复定义line-height了。但line-height会给人误解的地方也就是这个继承。这是怎么回事呢?别急,我们先来看一幅图。

  (图一)

  看着图一,是不是让你心生“亲切”呢?^_^不过即使不感到亲切,也会觉得眼熟。明眼人一眼就能看出这是line-height导致的,其实这就是line-height好玩的地方。

查看更多...

Tags: line-height

分类:CSS | 固定链接 | 评论: 3 | 引用: 0 | 查看次数: 160

上川岛2日游

  上川岛2日游回来,放几张照片晒晒先^_^

 

 

Tags: 游玩

分类:Life | 固定链接 | 评论: 2 | 引用: 0 | 查看次数: 150

a,你真的玩会了么?

  a,小块头有大智慧。闲话不说,先上图:

   (图一)

  如上图3个链接效果,本来只想说第3个的,另外2个是用来做对比滴。

  假设图一的3个链接有固定的HTML结构,如下:

  <p class="test"><a href="#">这是<span>传说</span>中的测试</a></p>

查看更多...

分类:CSS | 固定链接 | 评论: 2 | 引用: 0 | 查看次数: 160

被OpenSearch撞了一下腰

  OpenSearch还是很好很强大的,不过郁闷的是你的head又要多一个东西了。

  因为小站已经做了搜索,所以就没大去玩这个。对它感兴趣的朋友可以参考OpenSearch定义文档

  不过今天发现在写一个OpenSearch的xml时发现一个编码问题。

<?xml version="1.0" encoding="GBK"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
  <ShortName>Joy's Search</ShortName>
  <Description>Joy的Google定制搜索</Description>
  <Tags>Joy's Search</Tags>
  <Contact>dooyoe@gmail.com</Contact>
  <Image width="16" height="16" type="image/png">http://www1.pcauto.com.cn/dy/test/joy.s.png</Image>
  <Url type="text/html" template="http://www.google.cn/search?q={searchTerms}&amp;hl=zh-CN&amp;newwindow=1&amp;domains=doyoe.com&amp;sitesearch=doyoe.com"/>
</OpenSearchDescription>

  写了如上一段xml,在IE7下添加这个Joy's Search没有任何问题,不过在FF下却死活添加不了。初步猜测可能是编码的问题,因为在XML里有中文。于是试着把里面的中文全部改成英文,神奇的事情出现,FF下居然也可以添加了。

查看更多...

Tags: opensearch

分类:Other | 固定链接 | 评论: 1 | 引用: 0 | 查看次数: 171

用途相似的标签:cite,q与blockquote

  cite,q与blockquote这三个标签都是用来表示引用的,但这三者之间确是有着比较明显的区别的。

  cite是用来标明引言的,所谓引言,就是对一本书、一篇报告或其它出版的来源资料的引用。可使用该标签对参考文献的引用进行定义,比如书籍或杂志的标题。如:

  <cite>《傲慢与偏见》</cite>

  q是什么呢,是用来分离文本中的引语,定义一个短的引用。如:

  <q>能一起吃顿饭么?</q>,那位帅气的先生带着期盼的眼神等她回复。

  再说说blockquote,它是用来定义一段引语的。比如我们要引用某篇诗文或者文章片段,如:

  <blockquote>
   <pre>
      你站在桥上看风景,
      看风景人在楼上看你。
      明月装饰了你的窗子,
      你装饰了别人的梦。
   </pre>
  </blockquote>

查看更多...

Tags: cite q blockquote

分类:(X)HTML | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 192

用途相似的标签:em与strong

  em和strong虽然一个表现为斜体,以斜体来渲染指定的文本,一个表现为粗体,以粗体来渲染指定的文本,但它们却并不是用于表现的标签。它们都有着自己的语义:em是用于对文本的强调,strong用于对文本的特别强调。从em到strong是一个递进的关系。

  由于重要性的轻重,对于一句话,可能需要有强调,也可能在强调中还有特别强调。这时就需要同时用到em和strong,但在使用它们时,还需注意,如:

  <p><em>她是一个<strong>有文化,有内涵,有气质</strong>的江南美女</em></p>

  而不能写成:

  <p><strong>她是一个<em>有文化,有内涵,有气质</em>的江南美女</strong></p>

  原因是强调中还可以有着重强调,而着重强调中不应再有较弱的强调。因此em中还可以包含strong,而strong里却不可以包含em。

Tags: em strong

分类:(X)HTML | 固定链接 | 评论: 1 | 引用: 0 | 查看次数: 129

用途相似的标签:acronym与abbr

  有的时候为了方便传阅或者记忆,比如一句话太长,我们就会将其缩短些。或简单的缩句,或进行特殊的减短,如取首字母。

  那么在HTML如何来标识这些缩略词呢?一般我们会使用到2个标签,一个是acronym,另一个是abbr。

  其中,acronym被定义为首字母缩写词,abbr定义一个缩写内容。

  目前的一些较为高级的浏览器,如FF,OP,都会对2个标签的内容进行特殊的显示,会自行加上虚线。

查看更多...

Tags: acronym abbr 缩写

分类:(X)HTML | 固定链接 | 评论: 2 | 引用: 0 | 查看次数: 170

position:fixed的时刻已到来

  由于ie6及以下浏览器一直不支持position:fixed,所以使得这个特殊的定位方式一直不为大家所熟悉,本该由position:fixed来做的定位多数情况下都是用JS来实现了,说起来也算是一种资源浪费。

  估计是MS也是意识到不支持position的fixed值是一个错误,所以从IE7起,已经开始支持fixed了,而IE8也正大步向我们走来。于是我们可以开心的说,position:fixed的时刻终于真正的来临了。

  然而IE6还是不支持,又该怎么办呢。当然我们不奢望IE6还能再升级到支持fixed,但我们可以想办法让它“支持”。

  OK,来看DEMO

查看更多...

Tags: 定位 position fixed

分类:CSS | 固定链接 | 评论: 2 | 引用: 0 | 查看次数: 261

雨仍继续着昨日的疯狂
雷是必不可少的佐料

水珠从我的耳旁滑过
很静
清脆的落地声
心也静下来
任闪电如何肆虐
也激不起半点涟漪

小巷前有一滩水洼
我脱下鞋
虽然已经湿透

我仔细的回忆
回忆
水的味道
瓦砾的感觉
湿透的清醒

查看更多...

Tags: 红袖添香

分类:Poetry | 固定链接 | 评论: 0 | 引用: 0 | 查看次数: 150