美文网首页
响应式网页设计

响应式网页设计

作者: 7430a350ab89 | 来源:发表于2018-03-12 20:23 被阅读0次

响应式web设计(RWD)

  • 是在开发和设计网站过程中产生的一种方式,它的目的是让内容布局能随用户使用显示器的不同而变化。再明确点说,这种设计概念,就是让原本1292像素宽,4栏的内容,能够很好地显示在1025像素宽的用户屏幕上,同时还能自动简化成2栏。这种特殊的设计形式就被称为“响应式web设计”。

HTML5

  • 万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改。

CSS3(层叠样式表3级)

  • CSS3是CSS(层叠样式表)技术的升级版本,于1999年开始制订,2001年5月23日W3C完成了CSS3的工作草案,主要包括盒子模型、列表模块、超链接方式、语言模块、背景和边框、文字特效、多栏布局等模块。

JavaScript

  • JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。

SVG(可缩放矢量图形)

  • 可缩放矢量图形是基于可扩展标记语言(标准通用标记语言的子集),用于描述二维图形的一种图形格式。它由万维网联盟制定,是一个开放标准。

statcounter 的数据所制的图和表

屏幕快照 2018-03-12 下午7.54.46.png

采用了响应式Web设计

无采用响应式web设计

RWD的三项组成科技

  1. media query:允许网页根据访问站点设备的特点而使用不同 CSS 样式规则,最常用的是浏览器的宽度。

  2. 流动网格:一个被显式声明为网格的容器中,其所有子元素自动被认定为网格单元格,而这些网格单元格在没有被显式设置明确位置时,浏览器将会自动为这些网格单元格的位置进行计算,按照先后顺序从左向右,或从上到下排列。在这里把这种方式称之为网格的流动。

  3. 灵活缩放的图片:相对单位调整大小,以防止它们显示在包含它们的元素外面。

RWD和前後端的关系

RWD 是前后端的统一,后端来输出不同的内容,前段来按需加载资源。

教科书及RWD一词提出人Marcotte(2010)的网页连结

“响应式web设计”这个名字是Ethan Marcotte在2010年发明的。当时,他在A List Apart上写了一篇文章(http://www.alistapart.com/articles/responsive-web-design/),这篇文章综合运用了三种已有技术(弹性网格布局、弹性图片/媒体、媒体查询)实现了一个解决方案,就叫做“响应式web设计”。

相关文章

  • 交互细节丨什么是响应式网页设计,这种设计有何优缺点

    1. 什么是响应式网页设计? 1.1 响应式网页设计的概念 响应式网页(Responsive Web Design...

  • 响应式网页设计

    名词解释 1.什么是响应式网页设计 响应式网页设计或称自适应网页设计、回应式网页设计、对应式网页设计。 是一种网页...

  • 响应式网页设计

    一、介绍 什么是响应式网页设计? 响应式网页设计使您的网页在所有设备上都很好看。 响应式网页设计仅使用HTML和C...

  • 九、HTML5响应式布局

    @(HTML5)[相应式布局] [TOC] 九、HTML5响应式布局 什么是响应式网页设计(布局) 响应式网页设计...

  • 响应式网页设计

    名词解释 响应式Web设计(Responsive Web design): 响应式网页设计(RWD)是一种网页设计...

  • 响应式网页设计

    一.名词解释 1.响应式网页设计(Responsive Web design(RWD):“响应式网页设计”这个名字...

  • 响应式网页设计

    名词解释 响应式网页设计 Responsive Web design(RWD) “响应式网页设计”这个名字是Eth...

  • 响应式网页设计

    什么是响应式网页设计? 响应式网页设计(RWD)就是网页内容会随着访问他的视口及设备的不同而呈现不同的样式 响应式...

  • 响应式网页设计

    响应式网页设计,亦称“响应式Web设计”,其简称为RWD。所谓的响应式Web设计,是指“网页内容会随着访问它的视口...

  • 响应式网页设计

    响应式网页设计 “响应式网页设计”这个名字是Ethan Marcotte在2010发明的,即Responsive ...

网友评论

      本文标题:响应式网页设计

      本文链接:https://www.haomeiwen.com/subject/fphwfftx.html