首页 > 其他分享 >css使用@media响应式适配各种屏幕的方法示例

css使用@media响应式适配各种屏幕的方法示例

时间:2024-09-23 15:12:36浏览次数:9  
标签:示例 适配 media 屏幕 css 页面

定义和使用

使用 @media 查询,你可以针对不同的媒体类型定义不同的样式。

@media 可以针对不同的屏幕尺寸设置不同的样式,特别是如果你需要设置设计响应式的页面,@media 是非常有用的。

当你重置浏览器大小的过程中,页面也会根据浏览器的宽度和高度重新渲染页面。

PC端设备屏幕的宽度

页面宽度大于1000px(>=1000)且小于1200px(<=1200)的时候执行下面的CSS(实际刚好“>=1000”或“<=1200”的都执行)

 https://www.jb51.net/css/725261.html

标签:示例,适配,media,屏幕,css,页面
From: https://www.cnblogs.com/li-sir/p/18427114

相关文章

  • QCustomPlot QCPBars横向柱状图示例
    #include"qcustomplot.h"intmain(intargc,char*argv[]){QApplicationa(argc,argv);QCustomPlotcustomPlot;customPlot.resize(700,500);customPlot.show();QCPAxis*keyAxis=customPlot.yAxis;QCPAxis*valueAxis=......
  • QCustomPlot QCPBars纵向柱状图示例
    #include"qcustomplot.h"intmain(intargc,char*argv[]){QApplicationa(argc,argv);QCustomPlotcustomPlot;customPlot.resize(700,500);customPlot.show();QCPAxis*keyAxis=customPlot.xAxis;QCPAxis*valueAxis=......
  • <<编码>> 第 17 章 自动操作(1)--计算设备 示例电路
    info::操作说明首先闭合清零(clear)开关,清除8位触发器(锁存器)中的内容,并把16位计数器的输出置为0000H然后闭合RAM控制面板的控制端开关(接管信号开关)手动输入一组要加的数注:RAM地址0,1,2,3处已预设了1,2,3,4四个值断开接管控制开......
  • 开源MySQL 数据库闪回工具:MyFlash数据恢复工具的安装及使用示例
    MyFlash是一个由美团点评开源的MySQL数据库闪回工具,它专门用于回滚MySQL中的DML操作,如INSERT、UPDATE和DELETE。这个工具通过解析MySQL的binlog文件来实现数据的恢复。使用MyFlash前,需要确保MySQL的binlog格式设置为ROW,并且binlog_row_image设置为FULL。以......
  • MySQL binlog解析工具binlog2sql使用示例
    binlog2sql是一个用于解析MySQL的二进制日志(Binlog)的工具,它可以将Binlog事件转换为SQL语句,这对于审计、数据同步等场景非常有用。binlog2sql通常用于实现MySQL数据的实时同步到其他数据库或系统中。安装binlog2sql首先,你需要安装binlog2sql。如果你使用的是Python环......
  • myflash MySQL数据恢复工具的使用示例:误删除数据恢复和误修改数据恢复两种场景
    以下是myflash数据恢复工具的使用示例,分为误删除数据恢复和误修改数据恢复两种情况:误删除数据恢复:构建测试环境:创建测试数据库和表。假设你已经安装并启动了MySQL服务,登录到MySQL客户端,执行以下语句创建一个名为testdb的数据库和一个名为user的表:sqlCREATEDATABASEtest......
  • MySQL binlog --skip-gtids --include-gtids --exclude-gtids 参数作用及使用示例
    在MySQL中,--skip-gtids选项用于完全跳过全局事务标识符(GTID)的处理,而--include-gtids和--exclude-gtids则是用于选择性地应用或跳过特定的GTID范围内的事务。这些选项通常在MySQL的二进制日志(binlog)消费者工具(如mysqlbinlog)中使用,而不是直接应用于MySQL服务器本身......
  • PostgreSQL向量数据类型SQL示例
    PostgreSQL支持多种数据类型,其中包括向量类型,可以用来存储和处理几何对象,如点(points)、线(lines)、线段(linesegments)、盒子(boxes)、圆(circles)、路径(paths)、多边形(polygons)等。此外,PostgreSQL还支持数组类型,可以用来存储一维或多维数组。向量数据类型示例1.几何类型PostgreSQL提供......
  • Python NumPy处理数组的基本用法代码示例
    NumPy是一个用于处理数组(向量和矩阵)以及进行数值运算的Python库。下面是一些简单的例子来展示如何使用NumP:示例1:创建数组importnumpyasnpa=np.array([1,2,3])#创建一个一维数组b=np.array([[1,2,3],[4,5,6]])#创建一个二维数组print(a)print(b)示......
  • 英特尔®以太网网络适配器E810-CQDA1 / E810-CQDA2 网卡 规格书 e810 网卡 规格书 Int
    英特尔®以太网800系列网络适配器英特尔®以太网网络适配器E810-CQDA1/CQDA2在10到100Gbps的以太网速度下实现高效的工作负载优化性能关键特性•单、双端口QSFP28•应用设备队列(ADQ)•PCIExpress(PCIe)4.0x16•动态设备个性化(DDP)•以太网端口配置工具(EPCT)......