问题标签 [responsive]

我已经为我的网站 [ http://lhcrt.org.uk/ltrail/trailindex_page1.html]制作了许多页面，作为对新的响应式网站的第一次尝试。最初导航栏是在 Mobirise 中制作的，但其余的在 Pinegrow 中添加为 bootstrap 3。

我想在页面的任意位置添加简单的左/右滑动操作以更改为下一页。我已经尝试了我在网上可以找到的所有想法，例如 Hammer.js，虽然它可以在一个简单的 html 演示页面中运行，但我很想将它添加到我的工作页面中。我什么都做不了，但老实说，我不了解足够的细节。最简单的方法是什么？有人可以同时帮助我和一个好的事业。

我创建了一个应该响应悬停 ( mouseenter/ mouseleave) 和click事件的菜单，因此它可以与鼠标和触摸屏一起使用。

这是一个非常简化的版本：

我遇到的问题是触摸板触发元素被触摸时的事件，这会导致mouseenter类被添加，然后关闭。我添加了, 但两个处理程序仍然由同一个事件触发。click'active'stopImmediatePropagation()

我试图弄清楚为什么在我的代码中，当我的分辨率约为 400 像素时，浏览器正在加载大小图像。如果我的分辨率很小，我只需要加载小图像，对吗？即使在视网膜显示中，它也应该加载中等图像。

在过去的几个小时里，我一直在努力研究这个。

链接到 JSFiddle：https ://jsfiddle.net/italoborges/v8yftgj2/2/

我究竟做错了什么？

谢谢。

我看到很多人都在使用移动优先的方法而不是桌面优先。无论如何，我们必须使用媒体查询或一些响应式框架（如果我需要移动响应式网站）来做好移动响应。即使我选择桌面优先的方法. 为什么人们开始使用术语移动优先方法并且他们正在使用它。

我是整个 Bootstrap 场景的新手。尝试将图像作为导航栏品牌并在窗口出现时调整其大小

我也尝试过img-fluid添加style='width:100%'，但没有任何效果，而且它的大小始终是静态的。

我有一小段代码（其中的一个片段）。问题是，即使我使用媒体查询，图像也不适合屏幕。谁能告诉我如何解决这个问题，以适应屏幕？我使用的图像比屏幕大，所以它会在屏幕上移动，迫使人们水平滚动，这是不应该的——它应该自动适应屏幕。

这是我的代码：

我正在处理两列响应式电子邮件。一切看起来都很完美，除了我无法在我的一个 TD 中获得正确的边框以在移动设备上删除。我有以下样式集：

奇怪的是，底部边框添加得很好。

这是我的代码。任何帮助将不胜感激。我想不通这个。

我一直在研究一个给我带来麻烦的设计。这是它应该看起来的样子

我的代码与这个设计非常相似，但我无法让它正确适配。

我目前使用媒体查询设置它，以缩小图像并随着屏幕尺寸变小而堆叠在文本部分下；但是，虽然窗口大小正在变小，但它会将图像放在文本下方并留下很大的空白。

此外，在全分辨率下，图像和文本之间存在间隙，但我似乎无法让它们并排放置。我可以做些什么来让这个设计更容易实现吗？

我目前正在开发一个 Wordpress 博客主题 - 它必须是完全响应的。我想在更大的屏幕上显示 2 列布局，具有独立的列。 我想到了这样的事情 ，移动页面没问题 - 但在 2 列布局上，我遇到了这样的问题（下图） ，我尝试使用:nth-child()选择器 + floats，但它没有工作。
帖子应按日期列出！
如果有人能告诉我解决这个问题的方法，我将不胜感激！提前致谢。

编辑： 不使用引导程序或任何其他网格系统！

我正在一个 CSS 看起来非常混乱的网站上工作。

我注意到的第一件事是媒体查询按以下混乱的顺序排列……这肯定是错的吗？重组成正确的顺序是否明智？如果没有大量的工作，这可能吗？我想避免尽可能多的重复，那么这将是正确的顺序，我可以消除其中一些断点吗？