摘要:rem是CSS3中新增加的一个单位值,他和em单位一样,都是一个相对单位。不同的是em是相对于元素的父元素的font-size进行计算;rem是相对于根元素html的font-size进行计算。这样一来rem就绕开了复杂的层级关系,实现了类似于em单位的功能。Rem的使用前面说了em是相对于其父元素...
阅读全文
摘要:国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢?PX特点1. IE无法调整那些使用px作为单位的字体大小;2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;3. Firefox能够调整px和em,rem,但是96%以...
阅读全文
摘要:一、"自适应网页设计"的概念2010年,Ethan Marcotte提出了"自适应网页设计"(Responsive Web Design)这个名词,指可以自动识别屏幕宽度、并做出相应调整的网页设计。他制作了一个范例,里面是《福尔摩斯历险记》六个主人公的头像。如果屏幕宽度大于1300像素,则6张图片并...
阅读全文
摘要:昨天中午Google进行了一次在线讲座,讲述自适应网页设计的概念和方法,维护同一个网页代码,即可使网站在多种浏览设备(从桌面电脑显示器到智能手机或其他移动产品设备)上具有更好的阅读体验,这里我将该讲座内容简要的整理一下。 1、在HTML头部增加viewport标签。 在网站HTML文件的开头,增...
阅读全文
摘要:一些网站的首页背景图尺寸不随浏览器缩放而变化,本例使用CSS 实现背景图尺寸不随浏览器缩放而变化,方法一. 把图片作为background,方法二使用img标签。喜欢的朋友可以看看一些网站的首页背景图尺寸不随浏览器缩放而变化,例如百度个人版的首页,缩放后背景图的尺寸并不改变: 再比如花瓣网( hua...
阅读全文
摘要:1. 引入的时候字体类型分为: 和 如果只写一种,便会产生冲突。就是字体编码一样的话
阅读全文
摘要:前言像素完美(Pixel Perfection)、分辨率无关(Resolution Independent)和多平台体验一致性是设计师们的追求。 可访问性(Accessability)、加载性能和重构灵活性是前端工程师们关心的主题。当下互联网设备「风起云涌」,显示分辨率「层出不穷」,为 Web 创建...
阅读全文
摘要:前言像素完美(Pixel Perfection)、分辨率无关(Resolution Independent)和多平台体验一致性是设计师们的追求。 可访问性(Accessability)、加载性能和重构灵活性是前端工程师们关心的主题。当下互联网设备「风起云涌」,显示分辨率「层出不穷」,为 Web 创建...
阅读全文
摘要:为什么这种标签定义width,height等CSS属性时会发现完全不生效?因为它们不是容器,它们是内联元素,不是块元素CSS 块元素与内联元素关键字: css元素(block element)一般是其他元素的容器元素,块元素一般都从新行开始,它可以容纳内联元素和其他块元素,常见块元素是段落标签'P。...
阅读全文