响应式网站知识

成都响应式网站建设:响应式这件小事,你对它够了解吗
作者: 桔子建站   时间: 2017-08-27   阅读:   0

现如今的网站建设,离不开网站建设,现在上海网站建设公司越来越多,然而真的能把网站做好的,却屈指可数,那么对于响应式这件小事,你对它够了解吗?

说到响应式,没有比插件更方便的了,首先介绍一款好用方便的插件。

Bootstrap

\

对于响应式,它提供了两大类。

可用类

通过单独或联合使用以下列出的类,可以针对不同屏幕尺寸隐藏或显示页面内容。

超小屏幕手机 (<768px)

小屏幕平板 (≥768px)

中等屏幕桌面 (≥992px)

大屏幕桌面 (≥1200px)

.visible-xs-*

可见

隐藏

.visible-sm-*

.visible-md-*

.visible-lg-*

.hidden-xs

.hidden-sm

.hidden-md

.hidden-lg

从 v3.2.0 版本起,形如 .visible-*-* 的类针对每种屏幕大小都有了三种变体,每个针对 CSS 中不同的 display 属性,列表如下:

类组

CSS display

.visible-*-block

display: block;

.visible-*-inline

display: inline;

.visible-*-inline-block

display: inline-block;

因此,以超小屏幕(xs)为例,可用的 .visible-*-* 类是:.visible-xs-block、.visible-xs-inline 和 .visible-xs-inline-block。

.visible-xs、.visible-sm、.visible-md 和 .visible-lg 类也同时存在。

打印类

和常规的响应式类一样,使用下面的类可以针对打印机隐藏或显示某些内容。

class

浏览器

打印机

.visible-print-block.visible-print-inline.visible-print-inline-block

.hidden-print

想要熟练使用这一套方法,需要自己实践,自己动手丰衣足食,get到bootstrap技术,老板再也不用担心你做响应式了。

本文是成都响应式网站建设响应式网站制作成都高端网站建设与品牌网站策划服务-桔子科技公司为您整理!响应式网站建设,响应式网站制作,响应式网站开发,HTML5网站建设,成都响应式网站建设,成都响应式网站制作,成都响应式网站开发,桔子建站。


隐藏