web 相关问题

不要使用此标签。有关万维网方面的问题,请使用更具体的标签,例如[uri],[html],[http]或[w3c]。

媒体查询在 Tailwind CSS 中不起作用

TailWind CSS 中的媒体查询无法正常工作。 我的代码是这样的 TailWind CSS 中的媒体查询无法正常工作。 我的代码是这个 <img src={MYIMAGE} alt="Test Image" className="h-6 w-8 rounded-md gfold:h-8 gfold:w-14 gfold:rounded-xl sm:h-16 sm:w-24 " /> gfold -> (400px) - 我在 tailwind.config.js 文件中包含的介质尺寸。 sm -> (640px) - Tailwind 附带的默认介质尺寸。 当媒体大小低于sm时,尺寸是正确的,但是当我的屏幕大于sm尺寸时,尺寸不会改变。 现在我该怎么办? 请帮助我,我是 Tailwind CSS 新手。 首先使用顺风CSS,媒体查询用于较大的屏幕,默认的CSS适用于移动设备,所以请记住这一点 我建议使用 tailwind 定义的标准断点,而不是覆盖配置文件, <img src={MYIMAGE} alt="Test Image" className="h-6 w-8 rounded-md md:h-full md:w-full" /> 当屏幕大于 768px 时,这会将图片设置为全尺寸。 还要确保在 tailwindcss 中定义新断点时将以下内容添加到配置文件中 const defaultTheme = require('tailwindcss/defaultTheme') module.exports = {theme: {screens: {'gfold' :'400px' ,...defaultTheme.screens},}} 您可以在以下位置检查如何使用媒体查询创建顺风逻辑:https://learnjsx.com/category/1/posts/mediaQueries 要完全替换默认断点,请直接在 tailwind.config.js 中的主题键下添加自定义屏幕配置: theme: { screens: { 'sm': '576px', // => @media (min-width: 576px) { ... } 'md': '960px', // => @media (min-width: 960px) { ... } 'lg': '1440px', // => @media (min-width: 1440px) { ... } }, } } 您尚未覆盖的任何默认屏幕(例如使用上面示例的 xl)都将被删除,并且不能用作屏幕修饰符。 要覆盖单个屏幕尺寸(如 lg),请在 theme.extend 键下添加自定义屏幕值: module.exports = { theme: { extend: { screens: { 'lg': '992px', // => @media (min-width: 992px) { ... } }, }, }, }

回答 2 投票 0

尝试了解 CSS 选择器如何与 HTML 按钮交互

我是制作网站的新手,因此找到了一个模板可以用作我自己的个人网站的参考,到目前为止,我正在使用尝试删除边框的按钮,因此它是一个文本按钮...

回答 1 投票 0

如何切换到虚拟环境并让Python识别出已安装Flask?

我很困惑,因为我遵循了我在网上看到的每个论坛帖子的建议。我完全按照流程操作,一切看起来都设置正确,但 Pycharm 仍然无法识别

回答 1 投票 0

Flutter Web - 从 PC 浏览器检测屏幕/锁屏状态

我的目标是,如果 PC 进入睡眠状态或用户锁定 PC,则从 Flutter Web 应用程序中注销用户。 是否有 Flutter API/插件来检测 PC 屏幕是否进入睡眠状态或者是否...

回答 1 投票 0

如何使用 PReact 访问多个 props.children

我正在使用 astro 并使用 PReact 和 Bootstrap 创建了这个 Card 组件 卡.jsx 导入“bootstrap/dist/css/bootstrap.min.css”; 导出默认函数 Card(props) { 返回 ( ...

回答 1 投票 0

Azure DevOps 管道在测试运行时失败

我正在运行一个网络项目管道,它是在角度中构建的,但是,每次它在测试时都会失败,并出现错误“您的计算机资源不足”。退出 Windows 或重新启动...

回答 1 投票 0

如何使用Flask拒绝回复?

我正在使用 Flask 来实现 Web 服务。 @app.route('/myservice',methods=['POST']) def myservice(): 如果异常活动检测到(): 拒绝做出任何回应。 我想知道如何...

回答 1 投票 0

如何在上传大小为 1GB 的大文件时处理“存储/重试限制超出”Firebase 存储网络

相关代码: var storageRef = firebase.storage().ref(file_path); var uploadTask = storageRef.put(文件); 上传任务.on( '状态改变', 函数(快照){ // 观察状态变化

回答 1 投票 0

为什么Django上传文件到服务器失败

如果 request.method == 'POST': k = 请求.FILES obj = request.FILES['上传'] t = int(时间.时间()) 作业ID = '作业ID'+str(t) job_name = jobid + '_' + obj.name 打印(作业名称) ...

回答 1 投票 0

为什么架构出现在某些网站的搜索结果中而不是其他网站的搜索结果中?

我注意到搜索引擎使用 schema.org 来索引有关您网站的信息,并使用户更容易找到要查找的内容,但它仅适用于选择性网站。 我什么...

回答 2 投票 0

如何使用 CSS 移动网站中的元素

我需要使用什么才能使我的网站中的按钮向左移动。我尝试过使用不同的属性来移动我的按钮,我也尝试过搜索答案,但没有答案......

回答 1 投票 0

为什么标题和列表在tiptap 中不起作用?

我正在尝试使用tiptap制作文本编辑器,但标题和列表不起作用 输出 '使用客户端'; 从“@tiptap/extension-heading”导入标题; 导入 { EditorContent,EditorProvider,

回答 1 投票 0

文字无法出现在我网站上的图像顶部

我试图将鼠标悬停在每张图像上时在索引页上的每张图像上添加标题。 然而我尝试的一切都不起作用。我正在使用学校网站模板......

回答 2 投票 0

防止跨子域共享 Cookie

有没有办法阻止子域上的cookie共享 以下是我的会话 cookie 域 DJANGO_COOKIE_DOMAIN=.dev.fox.com 我的 set_cookie() 方法甚至为子域设置 cookie,例如...

回答 1 投票 0

如何从 Flutter Web 上的 asset 文件夹中的现有数据库读取数据。 db 或 sqlite

如何从 Flutter Web 上的 asset 文件夹中的现有数据库读取数据。或从 url 读取数据库,例如:https://example.com/mydatabase.db 或 .sqlite

回答 1 投票 0

漂亮的汤我=只返回无[关闭]

我试图从此链接中提取信息:https://wuzzuf.net/jobs/p/EVUpYcDnxix7-Odoo-Developer-Yodawy-Med-Giza-Egypt?o=2&l=sp&t=sj&a=search-v3| HPB 试图获得工作头衔和其他

回答 1 投票 0

每当用户单击网站的输入字段时我想打开手机图库

现在我正在使用 用于接受图像。对于此输入,我在不同的浏览器中得到不同的行为。有时...

回答 2 投票 0

如何逐字检查单词中的字母并进行相应更改? html js...打字游戏

打字游戏......我正在为我的游戏制作这个菜单......我有这个问题: 我的屏幕上有 2 个单词和一个打字区域,它会在其中检查按键并将其显示在屏幕上... 我想要每个c...

回答 1 投票 0

在文本字段中输入在网页中不起作用

我正在尝试自动化网页上的流程。该元素是 我正在尝试自动化网页上的流程。该元素是 <input aria-expanded="false" aria-owns="search-dropdown-results" data-accessibility-id="header-search-input-field" data-anchor-id="HeaderSearchInputField" data-lpignore="true" type="text" autocomplete="off" placeholder="Search stores, dishes, products" inputmode="search" id="FieldWrapper-0" aria-describedby="search-dropdown-results" class="Input__InputContent-sc-1o75rg4-3 idveBz" value=""> 首先,我在字段中输入文本,然后按 Enter 键。但 Enter 部分不起作用。请帮忙。 var inputElement = document.getElementById('FieldWrapper-0'); inputElement.value = "TEXT"; inputElement.dispatchEvent(new Event('input', { bubbles: true })); inputElement.dispatchEvent(new KeyboardEvent('keydown', { 'key': 'Enter' })); 我认为你完全搞乱了代码。这是JS版本。 尝试让我知道它是否有效。 var inputElement = document.getElementById('FieldWrapper-0'); inputElement.value = "TEXT"; var event = new KeyboardEvent('keydown', { 'key': 'Enter' }) inputElement.dispatchEvent(event, { bubbles: true }); inputElement.addEventListener('keydown', function () { alert('Keyboard Clicked'); }); I am trying to automate a process on webpages. The element is <input aria-expanded="false" aria-owns="search-dropdown-results" data-accessibility-id="header-search-input-field" data-anchor-id="HeaderSearchInputField" data-lpignore="true" type="text" autocomplete="off" placeholder="Search stores, dishes, products" inputmode="search" id="FieldWrapper-0" aria-describedby="search-dropdown-results" class="Input__InputContent-sc-1o75rg4-3 idveBz" value="">

回答 1 投票 0

为什么验证码出现在我的网站上?我没有安装它!请解释一下为什么它会自动出现以及如何禁用它

为什么验证码出现在我的网站上?我没有安装它!每当我想在 GT metrix 或 Pingdom 上测试我的网站速度时,验证码页面首先出现,并且只分析此页面。请...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.