媒体查询大小调整不正确
媒体查询是一种在前端开发中用于根据设备的特性和屏幕尺寸来应用不同的样式和布局的技术。它可以根据设备的宽度、高度、像素密度等特性来动态地调整页面的显示效果，以适应不同的设备和屏幕大小。
媒体查询可以通过CSS的@media规则来实现。通过在CSS中定义不同的媒体查询条件，可以根据不同的条件应用不同的样式。常见的媒体查询条件包括最大宽度、最小宽度、最大高度、最小高度、像素密度等。
媒体查询的优势在于可以实现响应式设计，使得网页能够适应不同的设备和屏幕大小，提供更好的用户体验。通过媒体查询，可以针对不同的设备提供不同的布局和样式，使得网页在不同的设备上都能够呈现出最佳的效果。
媒体查询的应用场景非常广泛。在移动开发中，媒体查询可以用于适配不同的移动设备，使得网页在手机、平板等设备上都能够正常显示。在响应式网页设计中，媒体查询可以根据屏幕大小调整布局和样式，使得网页在不同的屏幕上都能够呈现出最佳的效果。此外，媒体查询还可以用于实现打印样式的调整，使得打印出来的页面能够更好地适应纸张大小。
腾讯云提供了一系列与媒体查询相关的产品和服务。其中，腾讯云Web+是一款支持响应式网页设计的云托管服务，可以根据不同的设备和屏幕大小自动调整网页的布局和样式。腾讯云CDN（内容分发网络）可以加速网页的加载速度，提供更好的用户体验。腾讯云云服务器（CVM）可以提供稳定可靠的服务器环境，支持媒体查询的运行和调试。
更多关于腾讯云相关产品和服务的信息，您可以访问腾讯云官方网站：https://cloud.tencent.com/
相关·内容
1回答
测试媒体查询
、、
我写了一些媒体查询，如下所示，但当我尝试测试它们时，它们似乎不起作用，我认为媒体查询测试的是屏幕尺寸而不是浏览器尺寸，对吗？
如果是这样的话，你如何测试媒体查询是否在笔记本电脑15“上工作，连接到22”外部显示器，我想测试的样式是屏幕小于1300px。13“和低沉
@media only screen
and (min-device-width : 500px)
and (max-device-width : 1300px) {
h1 {font-size:90px; margin-bottom: 60px;}
h2 {font
浏览 0提问于2013-03-16得票数 0
我已经将我的页面字体设置为font-size: 0.6875em;，现在我想知道，当我通过拖动窗口(而不是使用JavaScript函数)来调整浏览器的大小时，我的文本大小会像我的DIVS一样减小吗？
看起来不是！我知道我可以添加CSS媒体查询，可能有一个JavaScript / jQuery工具可以做到这一点，但是当用户拖动浏览器的一角并减小(或增加)窗口大小时，我是否可以自动减小文本大小，或者我必须使用JS / CSS媒体查询吗？
任何建议都将不胜感激。
谢谢
浏览 2提问于2012-02-19得票数 1
回答已采纳
2回答
我希望能够预览在不同的视窗宽度的页面上的反应组件，以触发不同的CSS媒体查询。这是一个组件库，我希望能够向开发人员展示该组件在不同屏幕尺寸下的外观。
如何解决这个问题有什么策略吗？
浏览 1提问于2018-04-24得票数 0
当浏览器窗口调整大小时，我正试图获得带有css的地图的响应能力。到目前为止，我已经使用了在整个浏览器窗口上工作良好的百分比，并且对每个设备都使用了媒体查询，这也是正确的。我遇到的问题是，当我最小化浏览器窗口时，在地图图像缩小的地方(1200 at和992 at宽)。它抛出所有的悬停，他们没有在他们正确的位置。
另一件事是，当我对桌面使用另一个媒体查询时。然后将设备查询抛出。
任何帮助都是非常感谢的！
提前谢谢。
<div id="main">
<a href="/africa.html
浏览 1提问于2014-07-24得票数 0
回答已采纳
我经常使用带有全宽背景图像的页眉，比如这个页面的
对于背景图像，您会使用哪种媒体查询-stack？我希望移动设备使用的图像文件大小不是太大，但视网膜设备也有视网膜图像。因此，可能会有像一个大型媒体查询视网膜macs的东西，也许是一个真正压缩的图像与视网膜大小的视网膜ipads。也许是为小型移动设备、视网膜和非视网膜设备准备的？它变得相当复杂，当然，我不希望有20个媒体查询的列表，针对不同的屏幕尺寸，不同的分辨率和不同的(假设)网速。
有什么想法？您会优先考虑哪些设备？
谢谢。
浏览 0提问于2013-10-08得票数 0
我读过一篇文章说Javascript事件‘调整大小’会激发每个像素，并且具有宽度的媒体查询会更好，但是我没有发现任何关于媒体查询背后的内容。我看不出这是怎么可能的，因为没有每一个像素都有媒体查询操作，甚至浏览器也需要知道每个像素大小的变化。那么，为什么媒体查询应该比Javascript调整大小事件更好(至少对于宽度的改变是这样)？
对不起，如果我的英语有任何错误，那不是我的母语。
浏览 2提问于2021-06-17得票数 1
回答已采纳
4回答
有没有一种方法可以使用css3媒体查询来改变景观和肖像的设计？
所以我想检查一下它的效果。而是如何在桌面上使用。有没有什么工具可以像jsfiddle一样使用这种效果？
浏览 0提问于2013-12-06得票数 0
4回答
我需要知道CSS媒体查询是如何工作的。我的意思是，如果我使用@media(min-width: 768px)，这个函数会在每次调整窗口大小时调用吗？
因为我想知道我是否可以使用Javascript $(window).bind('resize orientationchange')，或者它是否会占用更多的资源。
它用于在div中添加或删除类，例如：
我的目标是在HTML中输入一个数据属性，该属性决定导航栏何时必须折叠(例如，数据断点“768”)。我会得到这个断点，自动生成一个响应式导航栏，而不需要更改任何CSS。我的想法是使用Javascript，但根据你的回答，这似乎真的不是
浏览 2提问于2015-03-10得票数 0
我在我的网站顶部有一个工具栏，上面有一些图片和文本链接。我希望文本链接的字体大小发生变化，以响应小于400px的屏幕尺寸。根据下面的来源，我已经使用@media查询实现了这一点。它可以工作，但问题是在手机上的旋转。如果页面是纵向加载的，则会应用@media查询，并且文本会更改大小。当旋转为横向时，@media查询规则将全部正确删除。当旋转回纵向时，将重新应用除font-size之外的所有@media查询规则。这意味着文本太大了。我已经截取了一个屏幕截图来展示它的工作方式：
如果需要，我可以提供更多代码，但目前我不能提供指向该站点的链接。提前感谢您的帮助！
/* CSS */
.toplin
浏览 1提问于2020-11-14得票数 0
我正在做一个类似于的简单的html 5游戏。
我需要让游戏响应，我想问我是应该使用CSS媒体查询，还是我应该使用一个基于百分比的布局，使用百分比维度来表示元素的宽度和高度。
最好的办法是什么？
浏览 6提问于2016-02-01得票数 0
回答已采纳
1回答
我四处看看，但需要一个更简洁的答案来回答这个问题。
我正在尝试为多个媒体设备构建当前项目中的CSS的最佳方法。我希望能够有一个样式表：
CSS重置(所有要使用的东西)，普通桌面“屏幕”。(只有桌面computers)Printing 'print‘(仅打印)iPhone/手持(仅手持)IE6样式表(只有IE6)
所以我的问题是:我认为控制这件事的正确方法是..
resets.cssset 为printing.cssuse css3媒体查询为desktop.cssuse条件注释'here‘为printing.cssuse css3媒体查询设置media="all“和(mi
浏览 2提问于2011-04-20得票数 2
回答已采纳
到目前为止，我只在闪存上运行了ubuntu，但是我想在我创建的分区驱动器上安装ubuntu14.04.3桌面amd64。我想知道我应该选择哪个文件系统来格式化分区: ext2还是ext3？我正在使用AOMEI分区助理标准版本。其他可用的选择是NTFS和FAT32，我确信我不应该使用它们。同时，我也希望对这卷书的大小提出建议。我将其设置为200 it，但我只有一个500 it的硬盘驱动器，并且在对分区进行混合之前，我将我的Windows分区缩小到了大约200 it。我不想让隔板太大或太小。我打算使用双引导选项，直到我对ubuntu更加舒适。如有任何建议或建议，将不胜感激。
浏览 0提问于2016-01-11得票数 0
回答已采纳
1回答
我使用媒体查询来实现响应式设计。但我发现，例如，每个浏览器对它的行为都不同。
在480x856分辨率下，chrome使用@media screen and (max-width: 480px)的规则，而火狐使用@media screen and (max-width: 680px)的规则，有没有办法在所有浏览器上实现相同的结果？
浏览 2提问于2016-02-19得票数 3
1回答
为什么以下媒体查询在FF (22.0)和Chrome (28.0.1500.71)中工作良好，而Safari (6.0.5)却忽略了它？
如果是相关的话，我使用macbook (10.7.5) macbook 13“
谢谢你的帮助!
另外，有人知道它是否在IE中工作吗？
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<style type="text/css
浏览 5提问于2013-07-26得票数 1
回答已采纳
目前，我正在努力解决响应式设计的问题。你经常听到的一句话是“移动优先！”。我理解这是什么意思，但我仍然不确定如何将其付诸实践。
我使用的是320和更高版本的工具包/样板，其中已经设置了一些媒体查询：min-width: 480px、min-width: 600px、min-width: 768px、min-width: 992px和min-width: 1382px。
正如您可能注意到的，像min-width: 320px这样的东西丢失了。
这是否意味着我在媒体查询之外设计页面的宽度为320px，然后使用媒体查询覆盖需要调整的某些位？
浏览 1提问于2013-01-14得票数 0
回答已采纳
5回答
在Javascript中，有没有一种直接的方法(不涉及解析css代码)来确定哪个媒体查询是活动的？
例如，我有两个查询：
@media screen and (max-width:800px)
@media screen and (min-width:801px)
如果不解析和查看clientWidth，我如何才能分辨出其中哪一个的计算结果为真。
浏览 0提问于2011-03-28得票数 15
1回答
我正在使用Twitter流API获取包含在tweet中的图像，并在我的Android应用程序中显示它们。表示图像的媒体对象包含一个直接链接到图像的media_url字段，以及一个名为size的JSON对象，该对象包含该图像可用的不同大小。问题是，我如何才能得到如此大小的图像？我想直接从Twitter下载缩略图，既然sizes对象包含一个拇指字段，那么它应该是可能的，但是如何实现呢？我已经尝试过将?size=thumb连接到media_url，但它没有起作用。媒体对象示例：
{"id":897839774635053000,"id_str":"897839
浏览 5提问于2017-08-18得票数 4
我很抱歉问一个简单的问题，但当窗口变小或使用移动设备时，我正在尝试使用不同的样式表。当我缩小浏览器窗口时，没有任何反应。以下是媒体查询。
<link rel="stylesheet" type="text/css" href="css.css" />
<link rel="stylesheet" type="text/css"
media="screen and (max-device-width:500px)"
href="2ndCss.css
浏览 0提问于2012-12-18得票数 0
回答已采纳
有没有人知道有没有办法在css媒体查询更改下刷新/重新加载jquery？
在这种情况下，我创建了一个示例：
如果将浏览器的大小调整为小于960像素，浏览器将应用媒体查询，但jQuery插件区域宽度将保持为960像素。
浏览 4提问于2012-08-22得票数 0
3回答
新的媒体查询。但我想我错过了船的某个地方。
假设我有一个topBar，与下面的snippit类似，它由一个topBar容器、固定的宽度和一个列表组成，整个单元向右浮动。我希望这样，只要屏幕调整大小，直到，比如说1000 to，topBar就会随着屏幕尺寸的调整而缩小。当它达到1000 we时，还会发生其他事情，但是我们以后会担心的。
为此，我需要同时设置topBar容器和topBar固定宽度的查询，还是只设置容器的查询？另外，我应该针对整个屏幕的是最大宽度还是最小宽度？
#top-menu
{
width: 100%;
background-color: white;
浏览 3提问于2017-01-16得票数 0
回答已采纳
有没有办法使用媒体查询而不是按预先确定的宽度逐步调整大小？例如。
目前我有一些类似的东西：
@media screen and (max-width: 1024px) { }
现在，只有当窗口达到神奇的1024px边界时，才会调整大小...然而，我需要它在每个阶段调整大小，而不仅仅是1024px。
如果用户将窗口缩小10%，则图像和字体大小也需要减小10%。
对于媒体查询，这是可能的吗?还是我必须走JS路线才能做到？
谢谢。
浏览 0提问于2011-07-06得票数 3
回答已采纳
1回答
使用vlcj调整视频大小
、、、、
我正在创建一个使用vlcj播放视频的桌面应用程序。当添加Jframe时，视频播放正常。但我必须播放两个以上的视频在同一个frame.So我添加了视频播放器到画布，然后画布到Jframe.The视频播放很好。由于我需要播放另外两个视频，我需要将视频调整到特定的分辨率。我尝试为画布设置大小，但没有work.So。有没有办法使用vlcj调整视频的分辨率？
有什么需要帮忙的吗？
浏览 8提问于2013-05-30得票数 0
1回答
有没有办法使用媒体查询在语义UI中更改网格容器的类，或者解决方案在于编写自己的Javascript来向HTML添加或删除类？
我意识到我没有很好地表达这个问题，所以我将更新它以反映这一点。这就是关于语义UI的媒体查询与JavaScript。
我的问题是:假设我有一个可堆叠的网格容器，它有两列，分别具有.four.wide.column和.twelve.wide.column类。默认情况下，当浏览器的窗口大小为1000px时，列中的文本将左对齐。然而，我想居中对齐的列内的文本时，窗口大小调整到一个较小的移动尺寸为767像素。
起初，我想要重新对齐媒体查询列中的文本，但是我突然想到这会违背语义UI
浏览 3提问于2018-05-25得票数 0
我正在处理一封html电子邮件，我的android4.2.2(Nexus4)手机没有接收到我尝试过的任何媒体查询。请注意，litmus.com (它在不同设备上呈现电子邮件的屏幕截图)显示，媒体查询至少在Android4.0上是有效的。
我试过了：
@media only screen and (max-width: 480px) {}
@media only screen and (max-width: 2000px) {}
@media only screen {}
似乎什么都不起作用。有什么建议吗？
浏览 0提问于2013-03-22得票数 1
回答已采纳
好的，我的媒体查询在chrome中运行良好，但当我在firefox或ie中尝试代码时，上边距或左边距不同，并且不像chrome那样准确！
下面是我使用的代码：
@media screen and (max-width:800px) {
#box-move {
margin-left:-20px;
margin-top:40px;
}
}
那么火狐或ie有什么特别的技术吗？
谢谢。
浏览 2提问于2014-12-23得票数 0
1回答
图片元素的利弊是什么？
、、、
HTML5 picture元素的优缺点是什么？
特别是浏览器是否会下载所有图像？还是浏览器只下载图像匹配媒体查询？
浏览 3提问于2015-06-09得票数 1
回答已采纳
3回答
如果不在媒体查询(示例1)中定义css选择器，而是在css选择器(示例2)中定义媒体查询，是否会有任何问题(性能是我最关心的问题)？
示例1-媒体查询中的css选择器
@media (min-width: 600px) {
.foo { ... }
.bar { ... }
.hello { ... }
.world{ ... }
}
@media (min-width: 1000px) {
.foo { ... }
.bar { ... }
.hello { ... }
.world{ ... }
}
@media (min-width: 1500px)
浏览 2提问于2015-03-05得票数 28
回答已采纳
2回答
媒体查询问题
、、
我想在移动设备上显示我的网页，类似于桌面版本-我已经做到了。这里我没有给我的页面添加viewport标签。我正在尝试只增加移动设备上的字体大小，因为我已经编写了如下媒体查询：
@media (max-width: 576px)
或
@media screen and (max-width: 576px)
当我将浏览器的大小调整到575px时，字体大小在变化，但当我在chrome上实际检查时，我没有看到我已经应用过的媒体查询片段，也没有在实际的移动设备上使用。
浏览 2提问于2019-11-23得票数 0
我正在做一个网站，应该是在移动设备上工作。我对这个主题进行了研究，每个网站都建议我对网站要使用的每个设备使用不同的媒体查询，例如：
/* ----------- iPhone 4 and 4S ----------- */
/* Portrait */
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) {
}
/* Landsca
浏览 4提问于2017-04-12得票数 1
我已经用Bootstrap做了一个网站，并使用了它的网格系统和CSS媒体查询，它是响应的，但我必须根据媒体查询中的最小宽度来设置字体大小，这使得它在达到相同媒体查询的最大宽度时变得更小。如何调整字体大小，使其适合该媒体查询中的所有屏幕大小？我是否需要为所有情况编写单独的媒体查询？Bootstrap Carousel也是如此。
我想在所有尺寸上实现相似的外观，这是可能的吗？
浏览 2提问于2018-10-24得票数 0
6回答
我正在使用Wordpress与一个响应主题。当我在移动设备上显示内容时，主题将在常规浏览器中正确显示。
当切换到broswers‘桌面模式’时，响应主题的行为有点奇怪。我想这是由于使用的屏幕大小。是否有方法显示已使用的CSS媒体查询？
当CSS说media min-width: 1024px的时候，我能看到屏幕大小的CSS在使用什么吗？或者是否存在一个简单的页面来测试它？或者更好:如何检测浏览器是否请求站点的“桌面版本”并将其用于CSS？
我在谷歌上搜索，但没有找到任何帮助，如何发现它，但没有找到有用的提示。
浏览 0提问于2019-06-09得票数 1
回答已采纳
我正在建立一个响应网站使用Twitter启动。我可以使用媒体查询和每个断点的不同CSS来显示/隐藏/修改/重新排列内容。效果很好。但是，对于每个断点触发不同的javascript又如何呢？做这件事最可靠的方法是什么？
在这种情况下，我使用的是砖石插件。我希望砖石在小型，中型或大型设备上布局项目，但在额外的小型设备，我不希望它。(我自己的本地列表布局将很好)。
这似乎是最现代的方法，使用window.matchMedia()方法。这还允许我添加一个侦听器，以便在窗口大小改变时可以添加/移除砖石结构。缺点是，根据，对matchMedia的支持并不是很好。我可以用一个多填充来解决这个问题，但听起
浏览 3提问于2015-03-14得票数 2
回答已采纳
**注意这是使用Adobe Edge动画。我已经尝试了媒体查询和预制的HTML文件，但为了获得我想要的东西，我需要将其作为Edge Stage。
所以我在我的项目'mobileNav‘和'deskNav’中有两个菜单作为符号。我的目标是让mobileNav在成为<=800时加载，让deskNav在>=800中加载。
到目前为止，它加载这两个符号，直到浏览器被伸缩。这是一个通过imgur实现的。
我对'compositionReady‘的代码是：
$(window).resize(function() {
if ($(window).width() &
浏览 9提问于2014-05-12得票数 0
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
2回答
我正在写一个静态网站，并在本地进行测试。我编写了一个媒体查询来稍微改变布局，这样在智能手机上看上去就好多了。通过媒体查询，我的目标是将文本和个人资料照片从并排改为一个接一个。
我的问题是，当我在Chrome或Firefox上加载HTML文件并调整窗口大小时，布局不会改变，我也无法确定如何修复它。任何帮助都将不胜感激。在下面找到我的密码。
对于我的标准CSS，我有以下(一个小片段)：
#about-text {
/*A div containing paragraphs and a table*/
display: inline-block;
width: 50%;
}
浏览 1提问于2014-07-27得票数 0
回答已采纳
2回答
令我感到奇怪的是，CSS3媒体查询和引导之间的区别在于什么。我已经进入了这么多的网站，但每个人都说，都是为了响应网站。如果是出于同样的原因，为什么两者都是为响应而存在的。我觉得这两者之间有一些很大的区别。在两种用法中谁排在第一位？媒体查询还是引导？在我的脑海里被困住了。寻求解释！
浏览 3提问于2015-11-19得票数 7
回答已采纳
1回答
我想知道，默认字体大小是否适用于设备？我是说应该的对吧？
如果是适应的，为什么我们需要添加媒体查询来更改字体大小，如下所示：
html {
font-size: 100%;
@media (min-width: @screen-lg-min) {
font-size: 100%;
}
@media (max-width: @screen-md-min) {
font-size: 93%;
}
@media (max-width: @screen-sm-min) {
font-size: 87%;
浏览 6提问于2014-07-30得票数 1
2回答
我知道没有明确的CSS媒体查询方法来检测触摸设备，我知道可以运行一个现代化脚本来检查触摸功能。
然而，我想知道是否有任何理由不使用媒体查询(定位:纵向)和(方向:景观)来帮助隔离触摸偏差。我的假设是只有触控设备才有这种能力。
是否有利用方向的台式机/膝上型电脑/键盘设备？
浏览 0提问于2014-05-12得票数 2
回答已采纳
我有一个样式表，里面有很多条件媒体查询语句。范围从iPhone分辨率到1600px。然而，我想让img在一个特定的div流体中，就像当浏览器窗口调整大小时重新调整大小一样，而不考虑已经编写的条件@media查询语句。我试着用
img { max-width: 100%}
但它根本不起作用，无论浏览器窗口如何，图像都会保持原样。为了使其有效，我在属性的末尾添加了!important，甚至粘贴到了从iPhone分辨率到1600px的所有媒体查询语句中，但它不起作用。
当浏览器窗口发生变化时，我希望图像在某个div内变得灵活，而不考虑已经编写的媒体查询，如何实现这样的效果。
我添加了
#inner_
浏览 0提问于2013-07-06得票数 0
回答已采纳
1回答
媒体查询什么都不做
、、、
我已经用SASS做了一段时间的HTML和CSS，直到今天我的所有响应都在工作，我的css媒体查询突然停止了反应。
它们在被加载到网页上的css文件中，但是没有任何元素对它们作出反应.我无法将3k行的完整css文件复制到这里。
但我想我错过了一些基本的东西。我使用的是gulp，它在处理css时没有报告错误。
我要疯了，我想不出问题来了。直到今天，所有的事情都在进行，我需要在周一之前完成一个项目，而我无法做出回应。
所有的查询都正常。今天我没有做任何改变，当我运行这个项目时，查询不会做任何事情。
对可能的情况有什么建议吗？谢谢你们。
浏览 1提问于2015-03-04得票数 2
回答已采纳
1回答
我试图禁用HTML的一部分，这段代码：
<div class="right">
当它达到一定的屏幕大小时，使用Media查询，但我不知道如何做。有什么建议吗？
谢谢
浏览 3提问于2020-01-21得票数 0
回答已采纳
2回答
如何使表格响应移动宽度并编写媒体查询
<table>
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Job Title</th>
</tr>
</thead>
<tbody>
<tr>
<td>David</td>
<td>Matman</td>
<td>Progra
浏览 1提问于2014-08-25得票数 0
1回答
我试图制作一个侧栏，但在使用媒体查询时遇到了问题。如果窗口小于991，我无法再次切换侧菜单。
因此，当窗口小于991px时，我将删除媒体查询，只需切换菜单按钮，否则再次单击该按钮来显示它。
所以我需要这样的东西。(这不起作用，因为每次我调整大小时它都会单击菜单)。我该怎么做？
$(window).resize(function () {
var width = $(window).width();
if(width < 991) {
//to hide
$('#sidebar-btn').click();
}
else
浏览 0提问于2018-03-08得票数 0
我期待创造一个形象，是反应，但也可扩展。我需要用HTML/CSS和utlize ( Javascript或JQuery )来实现这一切，以使其可扩展。我可以做一个可扩展的单元，或者一个响应性的图像--但是很难将两者结合在一起。可以用一些例子或指导。
因此，示例场景是，在初始页面加载时，整个页面有一个924x70 (这是响应的)。如果您单击该单元，它将扩展到924x250 (此单元还需要响应)--这可能吗？
提前感谢！
浏览 4提问于2013-07-31得票数 0
回答已采纳
2回答
我有一个对某些文本块具有php字符限制的响应站点。这个限制取决于它是桌面、平板电脑还是移动设备，但我很难根据设备/大小来切换这个限制。
这是我用来限制文本的php代码：
<?php
ob_start();
the_content();
$old_content = ob_get_clean();
$new_content = strip_tags($old_content);
if(strlen($new_content) > 400) {
echo substr($new_content,0,400) . "...";
浏览 3提问于2013-08-13得票数 0
回答已采纳
2回答
我想学习媒体查询和更多的CSS知识。作为现在我想要一个固定的侧边栏，不滚动与内容。
另外，我之前一直在读关于媒体查询的文章..只是还不能理解他们..也许一个样本会给我一些提示。
这是我的代码..
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
浏览 7提问于2013-08-16得票数 0
3回答
我在一个滑块中有一些图像，我试图阻止它们在我调整浏览器大小时自动调整大小。我试图实现的是图像保持相同的高度和略有不同的宽度，直到浏览器通过@media查询达到一个临界点。
这正是在调整浏览器大小时使用滑块实现的功能。
这是我的HTML：
<div id="content">
<ul class="rslides" id="slider1">
<li><img src="../Img/001.jpg" alt="foto" /></li&
浏览 3提问于2015-05-03得票数 0
2回答
我写了一些CSS代码，使HTML页面更适合移动浏览器。为了确保我的CSS只适用于手机，我使用了以下媒体查询：
@media only screen and (max-device-width: 480px)
作为一名iPhone开发人员，我在这个设备上进行了测试，它工作得非常好。但我希望我的CSS可以用于所有类型的设备(Android，Windows Phone等)。
什么是一个好的解决方案，可以适用于这些天的大多数智能手机？或者我需要一个更复杂的媒体查询？
浏览 0提问于2013-01-09得票数 9
回答已采纳
3回答
我是一个后端工程师，在一个小团队工作，所以偶尔需要做一些前端。我喜欢在开始之前开发一个良好的工作流和项目结构，所以我想知道如何为一个web应用程序创建一个响应性好的前端。
什么是构建CSS以创建响应性网站的最佳实践方法，需要为较小的屏幕“缩小”？具体而言:您是否首先创建移动版本，然后在CSS中使用最小宽度的媒体查询展开代码？还是你做了相反的事情，首先创建桌面分辨率版本？
其次，您是否在同一个媒体查询中定义了多个元素选择器和定义？还是为每个元素和选择器定义媒体查询？看起来，第二种方法可能会使代码更易读--尽管用媒体查询来“调整”一个工作站点来创建一个新版本，而不是简单的隔离--在一个媒体查询中关
浏览 0提问于2013-11-27得票数 3
1回答
我正在为个人项目工作的一个网站需要一个大的背景图像(全屏)在这个刚刚离开屏幕的是我的容器div <main>，用户滚动屏幕和这个容器div覆盖大背景图像，直到用户到达页面底部<footer>。
这在任何屏幕大小的上都能很好地工作，但只在景观视图中工作，现在我知道这是因为<main> div被设置成仅仅显示在屏幕之外，其身体高度css为100%，但是这会导致在人像视图中查看时出现问题，因为这样会将<main> div向下推到屏幕底部，在背景图像下面留下一个我不想要的巨大的空白。
我需要运行媒体查询来解决这个问题吗？(我宁愿不要因为媒体查询很好，但它
浏览 1提问于2016-09-05得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
云直播活动推荐
腾讯云开发者
