草庐IT

off-screen

全部标签

html - Foundation vertical (Split Layout) Off-Canvas 覆盖整个屏幕且仅在移动屏幕上

我正在尝试使用foundation6创建一个非Canvas;这个想法是我有两个基本的列应用程序,然后我尝试仅在屏幕较小时使用Canvas外效果隐藏左侧的一个,但首先我需要让它工作:第2列显示完整屏幕宽度和第一列这应该只在屏幕上激活。在桌面屏幕上应该只在一个屏幕上显示两列。想法是要有内容,而不仅仅是基础示例中的菜单。怎样才能达到描述的效果?×检查这段代码:https://jsfiddle.net/q1e45fzz/16/ 最佳答案 为了让Canvas外部分默认显示在更宽的屏幕上,您需要向Canvas外区域添加一个“reve

html - 为什么我的 'add to home screen' Web 应用程序安装横幅没有显示在我的 Web 应用程序中

我创建了一个service-worker和manifest.json文件,以便为Chrome浏览器用户显示“添加到主屏幕”Web应用程序安装横幅。它没有按预期工作。这是我的manifest.json文件{"name":"MySite","short_name":"Mysite","start_url":"./?utm_source=homescreen","icons":[{"src":"assets/cacheable/images/shortcut/120x120.png","sizes":"128x128","type":"image/png"},{"src":"assets/c

html - 为什么我的 'add to home screen' Web 应用程序安装横幅没有显示在我的 Web 应用程序中

我创建了一个service-worker和manifest.json文件,以便为Chrome浏览器用户显示“添加到主屏幕”Web应用程序安装横幅。它没有按预期工作。这是我的manifest.json文件{"name":"MySite","short_name":"Mysite","start_url":"./?utm_source=homescreen","icons":[{"src":"assets/cacheable/images/shortcut/120x120.png","sizes":"128x128","type":"image/png"},{"src":"assets/c

html - CSS 位置 : absolute screen resolution problem

CSS代码:top:45;left:98;float:right;position:absolute;z-index:2;当我在1024分辨率下工作时,我已经为floatdiv完成了上述编码,但是当我在不同的分辨率上测试它时,它没有对齐。我们该如何解决? 最佳答案 绝对定位元素根据相对定位的祖先或窗口定位。在您的情况下,它听起来像是位于窗口中。解决这个问题的方法是把你的绝对定位在相对容器内。这样,当窗口改变大小时,它将停留在正确的位置:Thisdivwillalwaysbe98pxfromtheleftand45pxfromthet

html - CSS 位置 : absolute screen resolution problem

CSS代码:top:45;left:98;float:right;position:absolute;z-index:2;当我在1024分辨率下工作时,我已经为floatdiv完成了上述编码,但是当我在不同的分辨率上测试它时,它没有对齐。我们该如何解决? 最佳答案 绝对定位元素根据相对定位的祖先或窗口定位。在您的情况下,它听起来像是位于窗口中。解决这个问题的方法是把你的绝对定位在相对容器内。这样,当窗口改变大小时,它将停留在正确的位置:Thisdivwillalwaysbe98pxfromtheleftand45pxfromthet

javascript - 我怎么能 "turn off"样式表?

我正在为一项大学作业创建一个网站,我们必须专注于可访问性功能。我已经成功地使用了调整文本按钮大小,但我正在寻找一种通过按钮或链接关闭css文件的方法。我在网上搜索了一下,似乎找不到太多东西,我找到了一个很好的网站,上面有我要找的按钮,所以按F12,但它不会显示它的javascript。理想情况下,我想在不使用javascript的情况下实现它,但如果没有其他方法,那么我愿意接受任何我可以获得的帮助。如果这是一个简单的问题,我很抱歉,但我确实努力寻找答案但无济于事,我只是一年级学生所以还有很长的路要走! 最佳答案 这应该可行for(i

javascript - 我怎么能 "turn off"样式表?

我正在为一项大学作业创建一个网站,我们必须专注于可访问性功能。我已经成功地使用了调整文本按钮大小,但我正在寻找一种通过按钮或链接关闭css文件的方法。我在网上搜索了一下,似乎找不到太多东西,我找到了一个很好的网站,上面有我要找的按钮,所以按F12,但它不会显示它的javascript。理想情况下,我想在不使用javascript的情况下实现它,但如果没有其他方法,那么我愿意接受任何我可以获得的帮助。如果这是一个简单的问题,我很抱歉,但我确实努力寻找答案但无济于事,我只是一年级学生所以还有很长的路要走! 最佳答案 这应该可行for(i

html - 响应式设计 : different images for different screen sizes

我们的客户希望在较小的屏幕上与在较大的屏幕上使用不同的横幅图片。不只是收缩/拉伸(stretch)以适应,而是实际替换不同的图像。全尺寸图像相当复杂——几个人、两个Logo和一些装饰性文字——因此对于较小的图像,他们希望裁剪掉一些人、删除Logo等。所以他们想要最大的,最复杂的桌面图像,更小更简单的图像适用于中型设备,然后更小更简单的最小图像。执行此操作的最佳方法是什么?我的第一个想法是包括所有三个图像,并使用@media最小/最大宽度使其中两个在任何给定尺寸下都不可见。喜欢:@media(max-width:400px){.smallimg{display:block}.midimg

html - 响应式设计 : different images for different screen sizes

我们的客户希望在较小的屏幕上与在较大的屏幕上使用不同的横幅图片。不只是收缩/拉伸(stretch)以适应,而是实际替换不同的图像。全尺寸图像相当复杂——几个人、两个Logo和一些装饰性文字——因此对于较小的图像,他们希望裁剪掉一些人、删除Logo等。所以他们想要最大的,最复杂的桌面图像,更小更简单的图像适用于中型设备,然后更小更简单的最小图像。执行此操作的最佳方法是什么?我的第一个想法是包括所有三个图像,并使用@media最小/最大宽度使其中两个在任何给定尺寸下都不可见。喜欢:@media(max-width:400px){.smallimg{display:block}.midimg

html - @media only screen and (max-width : 479px) not working for mobile

我的移动版本(最大宽度:479像素)不显示#111的背景颜色。相反,#000显示为背景色。请帮助我。@mediaonlyscreenand(max-width:1024px){body{background-color:#ff0000;}}@mediaonlyscreenand(max-width:767px){body{background-color:#000;}}@mediaonlyscreenand(max-width:479px){body{background-color:#111;}} 最佳答案 在文档的头部,确保你有