实际上我有一个进度条,它使用text-indent将一些文本放在进度的中间.
一切都在Chrome和IE中正常工作,但不在Firefox中.(是的,我不敢相信)
检查Chrome和Firefox的区别.
动画版
HTML
<div class="container">
<div class="bars bar1">sametext</div>
<div class="bars bar2">sametext</div>
</div>
CSS
.container{
border:1px solid #09c;
height: 20px;
width: 100%;
position: relative;
}
.container .bars{
text-indent: 45%;
position: absolute;
top:0;
font-family: arial;
color: #09c;
}
.container .bar2{
background-color: #09c;
width: 50%;
color: #fff;
overflow: hidden;
}
bar2和text-indent中的宽度是动态变量,用于显示填充进度条时的预期结果.
我在应用程序中使用express - next.js，并通过res.locals将一些配置从服务器传递到客户端，我的项目位于打字稿中，我使用 "@types/next": "^8.0. 6”。
问题：打字稿说"Property 'locals' does not exist on type 'ServerResponse | Partial<ServerResponse>'."
预期答案： - 一种覆盖“NextContext.res”或“NextResponse”以等于而Express.res不是http.ServerResponse
- 一种覆盖 NextResponse 以添加的方法locals: any | {x:strong}。
这是我们所拥有的以及如何重现的简化示例：
import React from 'react';
import Document, { Head, Main, NextScript } from 'next/document';
type Props = {
locals: {};
}
export default class MyDocument extends Document<Props> {
render() {
const { locals } = this.props;
return (
<html>
<Head>
<ComponentUsingLocalsInfo locals={locals} />
</Head>
<body>
<Main …