美文网首页
响应式布局——控制不同设备的显示样式

响应式布局——控制不同设备的显示样式

作者: 再吃零食是猪 | 来源:发表于2020-07-23 19:23 被阅读0次

响应式布局:就是根据我们做好的页面根据不同的尺寸在不同的屏幕上有不同的回馈,在小屏幕上可能我们会隐藏一些东西,这种技术就是响应式布局。

在网站上不是所有的元素或模块都是做成响应式的,理想的时候是,在不同的设备上面可能是不同的两套布局,这样更好维护。

例如:下面的直观易懂的例子实现的就是“后盾人”三个字,在屏幕中显示,在打印机中不显示。

screen:是指屏幕上显示  print:是指在打印机上显示

移动设备显示效果 打印机显示效果

总结:控制屏幕设备的显示样式放在这里面

<style media="screen">

</style>

控制打印机设备的显示样式放在这里面

<style media="print">

</style>

相关文章

  • 响应式布局——控制不同设备的显示样式

    响应式布局:就是根据我们做好的页面根据不同的尺寸在不同的屏幕上有不同的回馈,在小屏幕上可能我们会隐藏一些东西,这种...

  • 响应式布局

    了解响应式开发原理 就是使用媒体查询针对不同宽度设备进行布局和样式的设置,从而适配不同设备的目的 响应式布局容器 ...

  • 网络编程(十)移动端布局(4)

    一、 响应式开发 1.1 响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同设...

  • 【前端】08 - 移动端WEB开发之响应式布局

    1. 响应式开发原理 1.1 响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同...

  • 响应式布局.

    初学的时候,我总是把响应式布局和移动端适配两个事情搞混了. 响应式布局: 在不同的设备宽度下,一定会产生不同的显示...

  • 移动 web 开发 —— 响应式布局

    1.0 响应式开发原理 1.1 响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不...

  • 移动端WEB开发之响应式布局

    1.0 响应式开发原理 1.1 响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不...

  • 移动端开发之响应式布局

    1.0 响应式开发原理 1.1 响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不...

  • 移动端开发-02(响应式)

    1. 响应式开发原理 就是使用媒体查询针对不同宽度的设备进行布局和样式的设置,从而适配不同设备的目的。 设备的划...

  • 响应式布局

    概念 响应式布局(@media)针对不同的屏幕尺寸设置不同的样式,是解决移动端设备屏幕尺寸不同的问题。 优点 面对...

网友评论

      本文标题:响应式布局——控制不同设备的显示样式

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