样式化组件中的最小和最大媒体查询
在样式化组件中，最小和最大媒体查询是用于响应式设计的一种技术。媒体查询是一种CSS功能，它允许根据设备的特性和屏幕尺寸来应用不同的样式。
最小媒体查询（min-width）是指当设备的宽度大于或等于指定的值时，应用相应的样式。例如，可以使用最小媒体查询来设置在设备宽度大于等于768像素时应用的样式。
最大媒体查询（max-width）是指当设备的宽度小于或等于指定的值时，应用相应的样式。例如，可以使用最大媒体查询来设置在设备宽度小于等于1024像素时应用的样式。
这两种媒体查询可以结合使用，以创建更复杂的响应式设计。例如，可以使用最小和最大媒体查询来设置在设备宽度在某个范围内时应用的样式。
最小和最大媒体查询在开发响应式网站和应用程序时非常有用。通过使用这些媒体查询，可以根据设备的屏幕尺寸和特性来调整布局和样式，以提供更好的用户体验。
腾讯云提供了一系列与样式化组件和媒体查询相关的产品和服务，例如：
- 腾讯云CDN（内容分发网络）：CDN可以帮助加速网站和应用程序的内容传输，提供更快的加载速度和更好的用户体验。了解更多：腾讯云CDN产品介绍
- 腾讯云云服务器（CVM）：云服务器提供了可扩展的计算资源，可以用于部署和运行网站和应用程序。了解更多：腾讯云云服务器产品介绍
- 腾讯云云数据库MySQL版：云数据库MySQL版提供了可靠的数据库服务，用于存储和管理网站和应用程序的数据。了解更多：腾讯云云数据库MySQL版产品介绍
请注意，以上只是腾讯云提供的一些相关产品，还有其他厂商提供的类似产品可供选择。
相关·内容
3回答
现在我经常使用CSS媒体查询，我想知道按什么顺序使用它们是最好的。
方法1
@media only screen and (min-width: 800px) {
#content { ... }
#sidebar { ... }
}
@media only screen and (max-width: 799px) {
#content { ... }
#sidebar { ... }
}
显然，这样的代码更短，但是使用大量的CSS，您最终可以将一个容器的CSS扩展到样式表中的多个位置。
方法2
@media only screen and (min-widt
浏览 5提问于2015-03-30得票数 5
回答已采纳
3回答
而不是拥有一个巨大的responsive.css文件。我将媒体查询包含在同一个样式表中，以便将所有内容保持在一起，例如，我有wizard.css文件，其中包括：
span.crumbsTxt {
font-weight: normal;
font-size: 16px;
line-height: 1.25em;
}
然后，在同一个wizard.css文件的底部，我有：
/* col-sm - Small tablets */
@media (min-width: 768px){
span.crumbsTxt {
font
浏览 4提问于2014-10-30得票数 0
回答已采纳
2回答
响应式设计似乎并不完美
、、、
我对网页的响应性有问题。我使用了几个网站和Chrome的开发工具来确定问题，但它们都正确地显示了问题。一旦我在我的手机(三星Galxy S5)上打开页面，背景就变成了白色，只能看到文字。以下是我的媒体查询：
@media (max-width: 768px) {
body {
background-image: url(images/bg-img.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
浏览 21提问于2016-09-09得票数 1
2回答
用ViewPoints查询CSS
、、、、
我一直在做一些网站的工作。我注意到，大多数人在使用媒体查询时使用固定的px值，或者使用断点。
因此，我想知道在媒体查询中使用视点(vh/vw)是否不好，因为到目前为止，它们正在运行大多数设备。但该网站适用于所有标准/普通智能手机。
@media screen and (max-width: 100vw){
body,html{
}
}
浏览 1提问于2022-04-03得票数 0
回答已采纳
2回答
我已经正确地引用了viewport、meta标记和样式表链接，但我的媒体查询仍然无法工作。
除媒体查询样式外，所有CSS样式都有效。
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link re
浏览 1提问于2019-08-01得票数 0
我正在使用React制作web应用程序，我从API中获取数据并在页面上显示它。我是一个响应性网页设计的初学者，所以我尝试媒体查询。因此，对于移动视图，即最小宽度:320 So，我希望有一个div有display:flex，并且我已经将行和列分配给它的子组件，一切看起来都很好。但是当我尝试在桌面模式下查看它时，它仍然是一个灵活的容器。我尝试显式调用桌面的媒体查询，并将显示指定为阻止，但仍未更改。
@media only screen and (min-width:320px){
.form{
grid-template-rows: auto 1fr auto;
align-
浏览 0提问于2020-06-11得票数 2
回答已采纳
1回答
我有这个HTML/CSS
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
p{
color: white;
background: black;
}
@media only screen and (max-width: 768px) {
p {
浏览 44提问于2017-08-19得票数 4
回答已采纳
所以我想做的是让我的菜单图标只出现在小屏幕上，比如手机或平板电脑，而文本则出现在笔记本电脑或台式机等大屏幕上。我尝试过更改媒体查询和CSS，但没有效果。确切地说，我应该输入什么代码来修复这个问题。
浏览 6提问于2022-09-08得票数 0
1回答
多个媒体查询无法工作
、、、
嘿，伙计们，我不太能收到多个媒体查询。我的意思是
html代码：
<div class="container">
<div class="jumbotron">
<h1 id ="jumbo_text">{% block jumbo_text1 %} {% endblock %}</h1>
<h2 id ="jumbo_text2">{% block jumbo_text2 %} {% endblock %}</h2>
浏览 2提问于2015-10-15得票数 2
如果我使用媒体查询来控制CSS的最大屏幕宽度，我可以控制元素在该屏幕宽度上显示的位置(例如，使用'top‘、'left’等)。
但是如果我添加断点，那么我就不能再以这种方式控制元素的位置。为什么？
例如，在CSS中，我有一个媒体查询‘1th WIDTH’，这会导致内容呈现，正如你所期望的那样。但是，如果您取消注释媒体查询的‘第二个宽度’，这些新的位置值将被浏览器使用，即使在第一个宽度。为什么？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="U
浏览 7提问于2021-09-18得票数 0
1回答
我需要帮助构建一个媒体查询，这将允许我的目标台式机/笔记本电脑。我正在用下面的表格作为显示尺寸的参考。
显示尺寸列表中列出的大小对应于最佳画布宽度列表。
显示大小(以像素为单位)：
800x600
1024x768
1280x800
最佳画布宽度(以像素为单位)：
宽度780
宽度960
宽度1220
作为参考的表基本上列出了每个显示大小使用的布局宽度，但这不是我所困惑的。我不明白的是如何为这些宽度内的所有样式构造一个媒体查询。
到目前为止，这就是我所拥有的：
<link rel="stylesheet" href="fil
浏览 4提问于2012-12-11得票数 0
回答已采纳
1回答
我使用了@media (min-width:320px)，并注意到我的设计从移动扩展到桌面，继承了我的移动设计。更改为最大宽度，我的桌面设计被恢复，但只是这一次，我的移动设计再次混乱，就像它之前，我作出了所有的调整使用@media (最小宽度:320 of )，我做错了什么？
浏览 4提问于2022-04-27得票数 0
回答已采纳
5回答
使用twitter引导程序，我应用了
@media only screen and (min-width : 768px){
}
但是这个媒体查询也在处理所有其他宽度值，比如992px &1200 on。
有解决办法吗？
浏览 3提问于2015-02-26得票数 6
回答已采纳
1回答
我正试着把两个按钮组合在一起。
我有一个在大屏幕上工作的设计，两个按钮在同一条线上向右浮动。然而，在调整大小时，有一个按钮将显示在文本上：
所需经费如下：
当屏幕足够大时，这些按钮在文本的右边(工作正常)。
当屏幕变小时，按钮就会互相连接起来(而不是像屏幕截图中那样互相靠近)。在这种情况下，它们也应该具有相同的宽度。
浏览 0提问于2015-10-01得票数 0
回答已采纳
6回答
CSS媒体查询(媒体屏幕)
、、、、
我有以下关于我的WordPress主题的查询，它们是很多的;/
我是WordPress的新手，所以我不能正确地理解他们，但我相信我会理解你的解释的。
这是我不明白的。
他说:我不明白它们是哪个屏幕的。
他说:我不明白什么是“最大”(，这个是非常奇怪的)
3:最大宽度会终止设置吗？因为我们有600分钟和最多600分钟
这是密码。
浏览 2提问于2016-08-30得票数 0
回答已采纳
2回答
我有点糊涂。我首先设计我的页面手机，所以如果你在DevTools上打开它，在手机上看到它，你会看到这个设计完美地实现在一个设备上。在grid.css文件中的媒体查询中，我添加了桌面视图的样式规则，但当在桌面视图上打开它时，它不应用媒体查询。这里有一个链接，如果您想要签出它，https://repl.it/@GianinaSkarlett/API-Capstone，否则这里是片段：
这是CSS样式(移动第一)：
* {
font-family: 'Open Sans', sans-serif;
padding: 0;
}
.results {
padding: 10px
浏览 1提问于2018-11-08得票数 0
回答已采纳
在IE10和IE11列中，当对列进行全高删节时，这些列的位置会发生变化(较大的底部填充，较大的减去底部边距)
请在此处查看Codepen -
任何关于这方面的想法都会非常有帮助。到目前为止，我做过的唯一一件事就是在最小宽度:1200px媒体查询的最后一列上放一个浮点数。但我很想知道有没有人知道为什么会发生这样的事情。
顺便说一句，你需要取消对第二个媒体查询的注释才能得到bug。
浏览 3提问于2013-12-03得票数 1
我正在为iPhone构建一个PhoneGap/Cordova项目。
我有两个css文件-一个用于一般CSS规则，另一个用于iPad相关的css，如下所示：
<!--Main Style Sheet-->
<link rel="stylesheet" href="css/styles.css" />
<!-- iPad specific css-->
<link rel="stylesheet" media="only screen and (max-devi
浏览 0提问于2012-06-15得票数 1
回答已采纳
我可以使用当前div样式的Media查询吗？
.myDiv {
anyStyle : ...;
@media (myDiv's width > 100px) {
height: 40px;
}
}
我找到了几页，但上面说只使用窗口旁线。如果有人知道如何使用媒体，请告诉我我看到的链接：
浏览 3提问于2013-11-20得票数 1
回答已采纳
我正在构建一个网格网站，我希望能够在几个断点(浏览器大小)定义行的高度，但到目前为止，我只能定义两个。
这是默认的：
.container {
margin: 0 0;
max-width: 100%;
padding: 0 7%;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr) ) ;
grid-auto-rows: 500px;
row-gap: 50px;
}
以下是媒体查询：
@media(max-width: 500px) {
.container {
浏览 1提问于2022-06-01得票数 0
回答已采纳
3回答
我在ipad上有一个动画，东西从-200px转到1500px，并用overflow-x:hidden隐藏在浏览器中。
当我在ipad上查看时，我可以滚动"off screen"并看到隐藏的项目，即使是body和html，并设置为width:100%和height:100%.
如何在ipad?中修复此问题
浏览 0提问于2015-06-19得票数 0
很难到达work...but的新媒体查询..。
用angular2 .
很简单..。
如果最小宽度:576 do做这个，否则.
例如：
如果是576，则显示菜单类，隐藏工具栏类，反之亦然。
<ng-container class="menu" >
<i class="material-icons">menu</i>
</ng-container>
<ng-container class="toolbar">
浏览 2提问于2017-10-08得票数 0
回答已采纳
2回答
我正在尝试使用移动优先的方法进行响应式设计。
在这样做的时候，我希望将我的MAX媒体查询转换为MIN媒体查询。
因此，我的目标是实现渐进式增强，而不是使用优雅的降级
谁能解释一下重新设计CSS的最佳方法是使用最小宽度的媒体查询，而不是最大宽度的媒体查询？
在下面的示例中，我删除了95%的css，并保留了断点
//
html {
box-sizing: border-box; /* apply borderbox to * */
}
*, *:before, *:after {
box-sizing: inherit;
}}
//
@media screen and (max
浏览 0提问于2014-12-04得票数 0
1回答
在Chrome检查中，有一个选项可以“显示媒体查询”，这将导致在窗格顶部显示两个额外的“条形图”。(见图)
A淡蓝色的酒吧a黄色的酒吧，的灰色的酒吧顶部(似乎已经在那里)。
这三个酒吧的意义是什么？
浏览 8提问于2021-11-25得票数 1
3回答
我想知道在Foundation5中对XLarge和XXLarge设备进行媒体查询的目的是什么如果行宽只有62.5rem，任何人都可以改变这个大小，但是如果在大屏幕上它看起来很小，那么将其作为默认值有什么用呢？
浏览 0提问于2014-12-05得票数 0
2回答
我有以下媒体查询，可以在移动设备上使用，但默认设置不能在桌面上使用：
@media (min-width:481px) {
.header-section { width: auto; }
.search-block { display:none; }
}
@media (min-width:320px) {
.header-section { width: auto; }
.search-block { display:none; }
}
这些在手机上工作，但当我在桌面上查看时，显示在下方而不是在任何媒体查询下的默认CSS不起作用。在我的谷歌检查器中，我可以看到这些规则的media="
浏览 1提问于2013-09-12得票数 0
2回答
对于我的css，我有几个关于ie10的媒体查询...
@media screen and (max-width :1510px), screen\0{
div.jw-menu-3col-sm li a .menuItem {
padding: 0 12px;
}
}
@media screen and (min-width :1650px), screen\0{
div.jw-menu-3col-sm li a .menuItem {
padding: 0 16px;
}
浏览 5提问于2014-04-07得票数 0
1回答
目前，我有以下内容： const ButtonStyles = {
color: 'red',
} 但是我想为手机添加一个媒体查询，它会是这样的吗？： const ButtonStyles = {
color: 'red',
'@media (max-width: 900px)': {
color: 'blue',
}
} 如果语法不是这种格式，那么应该怎么做呢？
浏览 21提问于2021-06-29得票数 1
回答已采纳
5回答
我一直在尝试写一些简单的媒体查询，但我一开始就被困住了。媒体查询似乎只适用于文本，而不适用于div和图像。这是我的css代码以及html。
@media (max-width: 720px) {
.logo {
margin-top: 30px;
margin-bottom: 20px;
width: 100%;
}
<!-- only this piece of query works --> .text {
border-bottom: 2px solid red;
}
.gif {
clea
浏览 7提问于2015-07-17得票数 1
回答已采纳
7回答
我正在阅读的大多数使用媒体查询的教程都在演示min-width的使用，但我很少看到有人使用max-width。
这是某种设计趋势或模式，为什么人们使用min-width而不是max-width
例如，我正在设计一个网站，从移动端开始，一直到桌面。我使用的是Foundation 4，但使用媒体查询来删除页面上的各种元素，并重新定位源顺序。
我面临的一件事是为宽度小于或等于360px的任何设备提供自定义导航。我希望他们有一个垂直的导航，而不是一个内联的水平。所以我的想法是使用max-width来定位这些设备。
如果我首先设计手机，我应该使用min-width吗？也就是说，所有的默认样式都是针对移动
浏览 1提问于2013-05-20得票数 77
回答已采纳
2回答
我正在开发一个针对平板电脑和手机的网络应用程序。该系统是为了便于使用而设计的，因此必须同时支持景观模式和纵向模式。因此，当用户改变方向时，我的web应用程序会触发一些事件来相应地重新排列页面。
当键盘出现时，纵向模式被误解为景观。
这就是问题所在。在我的web应用程序的所有页面中，有一个文本框和一个按钮组成的搜索控件。当我处于纵向模式并单击textfield时，键盘显示和视口大小会发生height < width的变化，这会使我的应用程序在设备处于纵向状态时保持横向状态。当用户从字段中离开焦点时，键盘就会消失，肖像模式将被正确恢复。
看看上面的图片:当用户搜索某物时，景观模式被
浏览 5提问于2014-04-04得票数 3
2回答
如何使我的页面响应所有设备
、、、、
我试图通过使用媒体查询使我的页面响应。但是，该框没有响应所有媒体查询。我对媒体查询的最小和最大宽度感到非常困惑，这是代码，请有人向我建议如何使方框div响应所有设备。媒体查询不适用于我在代码中提到的各种屏幕大小。例如，对所有屏幕大小都应用了768 px媒体查询，现在我应该做什么呢？
.box {
border: 10px solid forestgreen;
height: 100vh;
width: 100%;
}
@media only screen and (max-width: 768px) {
.box {
width: 100%;
}
}
@me
浏览 10提问于2022-09-22得票数 -2
回答已采纳
2回答
我使用画布图像作为图像显示，它在大型设备上工作很好，当涉及到小型设备时，它没有响应性，所以我使用媒体查询进行响应性设计，尽管使用了媒体查询，但图像仍然没有响应。我使用CSS类，因为我将在一个网页的多个地方使用这个图像布局，请帮助我解决这个问题！
提前感谢！
HTML代码
<div class="img-container">
<img class='img' src="http://lorempixel.com/320/480/" alt=""/>
<canvas cl
浏览 2提问于2017-01-17得票数 0
回答已采纳
在媒体查询中，screen和only screen有什么区别？
<link media="screen and (max-device-width: 480px)" rel="stylesheet" href="m.css" />
<link media="only screen and (max-device-width: 480px)" rel="stylesheet" href="m.css" />
为什么要求我们使用only screen？screen本身是否提供了足
浏览 4提问于2011-12-18得票数 579
1回答
我有一个关于媒体问题的一般性问题。我正在工作的网站有两个响应性的视图：
最大宽度: 414 px (iPhone)和
最大宽度:770 max (iPad)
样式标记是按照这个顺序在css文档中编写的。因为它们是级联的，所以我的iPad查询一直覆盖我的iPhone查询(反之亦然)。
有什么简单的解决办法吗？好像我错过了一些很明显的东西。
浏览 5提问于2017-01-12得票数 3
我在我的网站上使用了“移动第一”的方法，我正在使用SCSS。
我有3个SCSS样式表：
base.scss (送达all)medium.scss (>= 768 to window)large.scss (>= 1024 to窗口))
他们的服务方式如下：
<link rel="stylesheet" href="/css/base.css" type="text/css" />
<link rel="stylesheet" href="/css/medium.css" type=&#
浏览 10提问于2012-03-14得票数 5
回答已采纳
2回答
我正在用MailChimp制作自定义模板。我还没有在几个电子邮件客户端上测试它，但到目前为止，我用gmail进行的测试显示，当我添加这个媒体查询时，它不仅不起作用，而且会导致整个html电子邮件呈现没有css。另一个CSS在没有查询的情况下对gmail工作得很好。在其他客户端上，媒体查询可以工作，并且不会阻止其他CSS工作。
这是gmail (和其他邮件)的一个已知问题吗，或者有办法解决这个问题吗？
@media only screen
and (max-device-width : 480px) {
.bodyContent div{
浏览 0提问于2012-07-28得票数 0
我有一个图像元素，它的样式是在max-width中定义的绑定参数中缩放到屏幕大小。
这种造型效果很好。然而，我的一些图像需要这个最大的大小(百分比)在较小的屏幕上删除(低于480 on )。为此，我需要“取消”模板结构设置的元素的max-width值。
HTML：
<figure class='image left'>
<div class='boxShadowInner wide190'>
<img src='/images/Bag.jpg' alt='text'&g
浏览 7提问于2017-11-06得票数 3
回答已采纳
我遵循了一个反应过程，我尝试将媒体查询应用到我的css中，同时在我的应用程序中使用css模块。但不幸的是，媒体查询不起作用。
下面是我的css文件：
.Burger {
width: 100%;
height: 250%;
margin: auto;
overflow: scroll;
text-align: center;
font-weight: bold;
font-size: 1.2rem;
}
@media (min-width: 500px) and (min-height: 400px) {
.Burger {
浏览 1提问于2022-08-29得票数 -1
2回答
我定义了以下媒体查询，以便为移动和桌面浏览器加载不同的.css文件：
<link rel="stylesheet" type="text/css" media="screen" href="desktop.css" />
<link rel="stylesheet" type="text/css" media="handheld" href="mobile.css" />
但由于某种原因，我在移动Internet Explorer中看到了来自d
浏览 3提问于2011-11-16得票数 2
回答已采纳
我有多个断点使用CSS媒体查询。我的问题在320 My的媒体查询中。当将viewport设置为320 is时，不会加载320 is的媒体查询。将加载640 of的媒体查询，而不是320 of的查询。为什么？
我的html:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="in
浏览 0提问于2014-07-23得票数 2
回答已采纳
2回答
响应媒体查询覆盖
、、
我写了这个针对240*480决议的媒体查询
@media only screen and (min-width:240px)
and (max-width:480px) {
.speech-bubble-container {
right: 0 !important;
width: 100% !important;
}
}
对321*480决议的另一个媒体查询
@media only screen and (min-width : 321px)
and (max-wi
浏览 3提问于2014-02-24得票数 0
回答已采纳
这是我的问题。这有点基本，但真的让我很生气。我制作了一个响应性网页，当手动调整窗口大小时，它看起来真的很棒，但是当使用内置在chrome中的响应工具时，它看起来就不那么好了。因此，我决定根据谷歌Chrome响应工具的外观进行设计，但现在手动调整窗口大小时，它看起来很糟糕。
我该相信哪一个?！我怎么知道我在手机上会长什么样？
编辑:还有，我有这样的基本规则
@media only screen and (min-device-width: 900px) {
body {
width: 60%;
margin: 0 auto;
}
}
使用铬响应工具时，车身
浏览 3提问于2016-07-05得票数 3
回答已采纳
1回答
似乎CSS只能识别第一个媒体查询。每当我改变屏幕大小以看到不同的变化时，它只“落入”第一个媒体查询或一般的CSS代码。
我尝试将媒体查询移动到工作查询的上方和下方，但没有任何改变。在查询中，我将几种颜色更改为黑色，以便测试它们是否真的有效，但这并没有改变任何东西。
这是我的媒体查询布局的一个示例。
*** REST OF CSS FILE UP HERE ***
@media screen and (max-width: 600px) {...}
@media screen and (max-width: 600px) {...}
@media only screen and (min-
浏览 20提问于2019-07-20得票数 2
回答已采纳
4回答
IE11忽略我的媒体查询，总是使用移动css。
奇怪的是，如果我改变浏览器的宽度，即使只有1-2个像素，浏览器也会呈现自己，并显示媒体查询。
我尝试过css lint，但我的css中没有错误。
我的css没有什么特别之处。就像这样的简单的css：
.div_example{
width: 100px;
}
@media (min-width: 768px){
.div_example{
width: 300px;
}
}
有没有人遇到过这个问题？
浏览 1提问于2017-01-09得票数 2
我正在建立我的WordPress博客(用scss做css )。我已经为浏览器大小的所有类型创建了媒体查询，您可以在此处看到：
当我调整笔记本电脑浏览器的大小时，它们工作得非常好。然而，当我在我的Iphone上测试这个网站时，他们就是看不到工作。
我还应该提一下，我确实在头文件中包含了正确的meta标记。
<meta name="viewport" content="width=device-width, initial-scale=1.0">
这里我漏掉了什么？
浏览 2提问于2012-05-02得票数 1
回答已采纳
3回答
jss中的媒体查询不响应
、、、
我在react元素中使用带有@media查询的样式道具。但出于某种原因，它没有回应。我在用JSS。这是我的密码
const style = {
usernameConatiner: {
display: "flex",
alignItems: "center",
backgroundColor: "red"
},
"@media screen and minWidth(32em)": {
usernameConatiner: {
浏览 0提问于2019-01-08得票数 3
回答已采纳
1回答
我正在尝试将我的项目更改为独占的样式组件使用。我有类似这样的东西 <div className={isGrid ? "card-grid" : "card-list"}> 我的div根据一个条件获取卡片网格或卡片列表className。如何在有样式的组件和没有css文件的情况下实现这一点？此外，我需要的媒体总是卡网格低于600px (@ className )
浏览 23提问于2020-01-31得票数 0
我遇到的情况是，CSS媒体查询(例如针对较小设备(智能手机)的CSS媒体查询)在我的页面上运行良好，可以设置初始页面元素的样式，但随后应用于我后来使用Jquery方法插入到页面中的元素时却不一致。在对此进行了大量测试之后--查找我是否在重写CSS类或类似的东西上犯了错误--我找不到解决方案，这促使我怀疑问题是否存在于Jquery本身，可能是因为一些Jquery方法与CSS媒体查询不像其他方法那样兼容？
<div class="headingwrapper top-center">
<h1 class="bigheading">S
浏览 1提问于2018-01-27得票数 1
1回答
我有一个嵌入在网页上的视频。视频下面有一个标题，包装在h2头标记中。视频下面还有一个用P标签包装的文本。我已经使视频响应式，以便用户可以查看视频使用他们的手机。但是，我不知道如何使标题标签和段落标签具有响应性。h1标签对于手机大小来说太大了。根据屏幕的宽度，我想要小一点的字体。如何使视频下的文本具有响应性。
代码如下：
<!DOCTYPE html>
<html>
<head>
<title>Responsive design</title>
<link type="text/css" rel=&#
浏览 12提问于2016-09-11得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
