reactjs 通过将鼠标悬停在文本字段上如何删除黑色边框

rqqzpn5f  于 2023-03-12  发布在  React
关注(0)|答案(2)|浏览(111)

当我们想悬停在文本字段上时,文本字段中出现一些黑色边框,如何解决此问题

import React, { useState } from "react";
import TextField from '@mui/material/TextField';
import { styled } from '@mui/material/styles';
const styles = styled(TextField)({
  '*.Mui-focused': {
    borderColor: 'transparent',
    outline:'none',
  }})
export default function Demo() {
  return (
    <>
      <TextField id="standard-basic" label="Standard" variant="standard"  />
    </>
  );
}
csga3l58

csga3l581#

您可以添加此样式以在悬停时设置新颜色

'&:hover fieldset': {
      borderColor: 'grey',
    },
hxzsmxv2

hxzsmxv22#

这对我很有效

'& .MuiInput-underline:hover:before':
{
    border: 'none !important'
},

相关问题