小编Ali*_*eza的帖子
CSS中*和*|*有什么区别？
在CSS中,*将匹配任何元素.
经常*|*使用而不是*匹配所有元素.这通常用于测试目的.
CSS *和*|*CSS有什么区别？
推荐指数
解决办法
查看次数
React vs ReactDOM？
我有点新的反应.我看到我们必须导入两件事才能开始,React并且ReactDOM,任何人都可以解释它们之间的区别.我正在阅读React文档,但它没有说.
推荐指数
解决办法
查看次数
CSS - "位置:固定"在Firefox中表现得像"绝对"
我一直在Safari中建立一个网站,我刚刚在Firefox中对它进行了测试,我的固定导航元素表现得好像它们的位置是绝对的.
#navigation {
display: block;
width: 100%;
height: 50px;
position: fixed;
left: 0px;
bottom: 0px;
text-align: center;
z-index: 99000;
}
这是我用于主导航包装的CSS(它是底部导航.).在Webkit中,它完美地运行:也就是说,它无论如何都会粘在窗口的底部.在Firefox中,它将自己定位在标签的末尾,因此,例如,在长页面上,我必须向下滚动才能看到它.它表现得好像是绝对的.
我也有侧边栏导航.
.slidebar {
display: block;
position: fixed;
left: -1px;
top: -1px;
width: 1px;
height: 100%;
overflow: hidden;
-webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-o-transition: all 300ms ease;
-ms-transition: all 300ms ease;
transition: all 300ms ease;
z-index: 99998;
}
这个侧边栏也表现得好像它是绝对的 - 也就是说,它正确地将自己定位在屏幕外,但它是伸长的<body>,因此出现了水平滚动条.的height: 100%;还响应<body>高度,而不是窗口的高度,所以,例如,我的<header>具有20像素的顶缘,和滑杆指出余量太(所述主体具有0余量).同样地,它不是height: 100%;在窗口底部的结尾,而是在底部结束,从而<body>考虑页脚的底部边缘.
我无法理解为什么会发生这种情况.元素检查显示所有属性都正常加载,在Chrome和Safari中它可以正常工作.它最初工作,它最后一次我甚至编辑了导航,但它已经停止工作,因为我建立了网站的其他,不相关的部分.
推荐指数
解决办法
查看次数
推荐指数
解决办法
查看次数
如何在webpack配置下拆分媒体查询？
因为我们可以导入如下样式表:
<link rel="stylesheet" media="screen and (min-width: 900px)" href="widescreen.css">
<link rel="stylesheet" media="screen and (max-width: 600px)" href="smallscreen.css">
这将通过仅加载符合media属性条件的css文件来帮助更快地加载网站.MDN
我没有运气搜索可以拆分查询的webpack配置,或者至少让我手动指定哪个css条目应该在哪个媒体上加载.
我唯一的解决方案是编写nodejs脚本并index.html在构建时注入,但在我看来这不是干净的方法.
那么有什么webpack配置这种东西？
推荐指数
解决办法
查看次数
如何使用angular cli升级小角度版本的角度
这是一个简单的问题,但我很难通过Google找到答案......
我有一个角度4项目(使用angular cli创建),并希望使用刚刚在4.3中发布的http拦截器.
如何使用angular cli升级到此次要版本？
推荐指数
解决办法
查看次数
使用 UUID 作为列表键会导致 React 中不必要的重新渲染吗？
我有一个项目列表，其中包含的数据不足以生成唯一键。如果我使用 uuid 库生成 ID，单个项目的更改是否也会导致其他项目重新呈现，因为它们的密钥每次都会更改？
const people = [
{
gender: 'male',
firstName: 'david',
},
{
gender: 'male',
firstName: 'david',
},
{
gender: 'male',
firstName: 'joe',
},
]
const renderPeople = () => {
return people.map(person => {
return (
<div key={uuid.v4() /* a new value each time? */ }>
<p>{person.gender}</p>
<p>{person.firstName}</p>
</div>
)
})
}
一段时间后......其中一个大卫改变了
const people = [
{
gender: 'male',
firstName: 'david',
},
{
gender: 'male',
firstName: 'davidzz',
},
{
gender: 'male',
firstName: 'joe',
},
]
推荐指数
解决办法
查看次数
无法让 <body> 元素覆盖整个页面
这里的目标是让侧边栏覆盖页面的整个高度。现在 #side 根本没有设置 height 属性，它确实根据需要跨越了整个 body 元素（当我将 height 设置为 100% 时，它没有跨越整个 body 元素......去图）。所以问题似乎是#side 的父元素body 没有跨越整个页面。
我已经为 HTML 元素和 body 元素尝试过（感觉像是）一百万种不同的高度选项，但没有任何效果。如下图所示，这与跨越整个页面高度的 body 元素非常接近。
几件事：
- 我有一个固定的背景图像，它确实覆盖了整个页面。我不确定这是否与我遇到的问题有关。
- HTML 元素与下图中突出显示的 body 元素大小相同
- 我尝试将 body 和 HTML 的 min-height 和 height 属性设置为 100% 以及 100vh 和 120vh。
- 正文和 HTML 都没有任何边距或填充。
- 我发现发布了类似的问题，但没有一个解决方案可以解决我的问题。
这是我目前所拥有的：
html, body {
margin: 0;
padding: 0;
min-height: 100%;
/* I have also tried height: 100%; */
}
body {
display: flex;
}
#side, #header-content {
/* no specified height because I found …推荐指数
解决办法
查看次数
ES6检测函数是否在类实例的原型链上
鉴于ES6课程:
class C {
x () { }
fnIsMethodOfC (fn) { return /* ? */ }
}
以及各种功能
function y () {}
z = () => {}
有没有一种有效的方法来确定函数是否是C的方法
c = new C()
c.fnIsMethodOfC(c.x) === true
c.fnIsMethodOfC(C.prototype.x) === true
c.fnIsMethodOfC(y) === false
c.fnIsMethodOfC(z) === false
我知道可以递归循环遍历原型链,但这将是一项昂贵的操作.
链接相关问题:
推荐指数
解决办法
查看次数
在 svelte 文件中导出打字稿类型
我想导出我在其中一个文件中定义的类型并将其导入到另一个文件中。
export type myNewType = {name: string};
添加时，linter 显示以下错误export：
Modifiers cannot appear here.
我可以通过创建一个新ts文件并从中导入类型来使其工作。我只想知道是否有办法在svelte文件中定义类型。
更新：
我使用 sapper 模板，它可以正常运行，但TS功能不起作用，并在vscode从 svelte 文件导入类型和导出类型时显示错误。
推荐指数
解决办法
查看次数
标签 统计
css ×3
javascript ×3
reactjs ×3
angular ×1
angular-cli ×1
css-position ×1
ecmascript-6 ×1
es6-class ×1
firefox ×1
function ×1
html ×1
namespaces ×1
node.js ×1
npm ×1
prototype ×1
react-dom ×1
rendering ×1
sapper ×1
svelte ×1
typescript ×1
webpack ×1
webstorm ×1