文章标题

转载 2016年06月02日 10:43:15

国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢?
PX特点

  1. IE无法调整那些使用px作为单位的字体大小;

  2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;

  3. Firefox能够调整px和em,rem,但是96%以上的中国网民使用IE浏览器(或内核)。

px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册)

em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。(引自CSS2.0手册)

   任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。为了简化font-size的换算,需要在css中的body选择器中声明Font-size=62.5%,这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10,然后换上em作为单位就行了。

EM特点

  1. em的值并不是固定的;

  2. em会继承父级元素的字体大小。

所以我们在写CSS的时候,需要注意两点:

  1. body选择器中声明Font-size=62.5%;

  2. 将你的原来的px数值除以10,然后换上em作为单位;

  3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明。

    也就是避免1.2 * 1.2= 1.44的现象。比如说你在#content中声明了字体大小为1.2em,那么在声明p的字体大小时就只能是1em,而不是1.2em, 因为此em非彼em,它因继承#content的字体高而变为了1em=12px。

rem特点

    rem是CSS3新增的一个相对单位(root em,根em),这个单位引起了广泛关注。这个单位与em有什么区别呢?区别在于使用rem为元素设定字体大小时,仍然是相对大小,但相对的只是HTML根元素。这个单位可谓集相对大小和绝对大小的优点于一身,通过它既可以做到只修改根元素就成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应。目前,除了IE8及更早版本外,所有浏览器均已支持rem。对于不支持它的浏览器,应对方法也很简单,就是多写一个绝对单位的声明。这些浏览器会忽略用rem设定的字体大小。下面就是

一个例子:

p {font-size:14px; font-size:.875rem;}

注意:

    选择使用什么字体单位主要由你的项目来决定,如果你的用户群都使用最新版的浏览器,那推荐使用rem,如果要考虑兼容性,那就使用px,或者两者同时使用。

在这里为大家提供一个px,em,rem单位转换工具

地址:http://pxtoem.com/

转子:原文地址

wordpress 通过the_title()和get_the_title函数获取文章标题

the_title() 输出或返回当前文章标题。此标签用在主循环里。如果此文章是受密码保护的或者是私有的, 就会在文章标题前标记上"Protected:"或者"Private:"字样。 用法:...
  • xuplus
  • xuplus
  • 2014年08月25日 09:31
  • 3751

文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题文章标题

文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正    文文章正文文章正文文章正文...
  • coolhomess
  • coolhomess
  • 2008年11月03日 10:14
  • 56

修改DEDECMS文章标题长度,解决DEDECMS文章标题显示不全

在用dede调用列表标题出来的时候,会发现标题文字字数显示不完全,那是因为dede默认标题出来长度是30个字符,为了让标题显示完整,要做以下修改!1、进入后台–系统–系统设置–系统基本参数–其他选项–...
  • yxwmzouzou
  • yxwmzouzou
  • 2015年04月29日 11:25
  • 10404

织梦列表页调用文章标题和摘要

【列表页调用文章标题和摘要】 显示效果: 代码如下: {dede: list titlelen='30' infolen='150'orderby='pubdate' limit=”...
  • cctv1937
  • cctv1937
  • 2015年07月01日 17:33
  • 3889

为你的wordpress文章标题添加图标

看到CSDN的文章标题前用“原/转”两个小图标来表示文件类型很简洁,于是也想到为自己的wordpress博客增加类似功能。     我想实现在我写文章选择分类目录时,若属于“原创”分类,则显示“...
  • linxiaojia
  • linxiaojia
  • 2014年11月22日 00:38
  • 871

正则表达式小试牛刀--匹配我的博文标题

正则表达式小试牛刀--匹配我的博文标题 作者:vpoet 日期:20150625 正则匹配,我以我的博客页面的博客标题为例:http://blog.csdn.net...
  • u013018721
  • u013018721
  • 2015年06月25日 09:22
  • 2828

wordpress 修改博客文章标题字体大小

运维wordpress过程中,遇到一个问题,博客文章的字体太大,却总是无法修改成功。 按照网络资料,修改h2对应的font-size的值,更新后却没有生效。这个问题折腾了好久让我头疼不已。用Chro...
  • dreamstone_xiaoqw
  • dreamstone_xiaoqw
  • 2017年09月05日 14:11
  • 524

让wordpress首页和分类列表页只显示文章标题列表

http://up2u.72pines.com/2009/07/rangwordpressshouyehefenleiliebiaoyezhixianshiwenzhangbiaotiliebiao/...
  • zzsg2005
  • zzsg2005
  • 2012年02月27日 10:20
  • 5029

用java提取不同类型的文章标题就要设计出不同的正则表达式

用java中提取不同类型的文本目录要设计出不同的正则表达式         最近,我从网上下载了一个用java编写的用正则表达式从文本文件中批量提取文本目录的程序。用该程序,我从《神墓》这本章回小说...
  • myhrrjava
  • myhrrjava
  • 2016年10月28日 10:29
  • 499

文章标题 文章标题 文章标题 文章标题

文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文 文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正文文章正...
  • swordray
  • swordray
  • 2007年07月18日 18:33
  • 259
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:文章标题
举报原因:
原因补充:

(最多只允许输入30个字)