在PowerPoint中 占位符和文本框一样 也是一种可以插入的对象

Posted 2023-05-12

判断题：
在PowerPoint中 占位符和文本框一样 也是一种可以插入的对象 √or×?

谢谢！

错，占位符是无法插入的，占位符的多少和位置是由版式决定的，用户可以删除，但无法添加。 参考技术A 正确
占位符和文本框是一样的 参考技术B 可以呀?实在不行的话可以在像WORD里插入后复制粘贴进去的! 参考技术C 应该不是插入对象而是普通符号
应该为错

如何在 React Material UI TextField 中居中占位符和文本

【中文标题】如何在 React Material UI TextField 中居中占位符和文本

【英文标题】：How to center placeholder and text in React Material UI TextField

【发布时间】：2020-01-11 03:00:12

【问题描述】：

当前设计：

预期设计：

TextField 标签如下所示：

<TextField
        multiline=false
        autoFocus
        placeholder=props.defaultAmt
        helperText="Enter amount to pay"
        margin="normal"
        InputProps=
            startAdornment: <InputAdornment position="start">₹</InputAdornment>
        
        />

我想将所有内容都集中在 TextField 中。我尝试过使用textAlign: 'center'，但它不起作用。

【参考方案1】：

您可以覆盖InputAdornment 组件中的positionStart 规则，其边距百分比取决于您的大小和其他影响文本字段样式的参数。我会建议这样的事情（我假设您正在使用makeStyles 生成您的样式，但要通过您自己的方式进行调整）。

要使 helperText 居中，只需将 Typography 组件添加到 prop 中，因为它是节点类型。向 Typography 组件添加样式以使文本居中，它应该可以工作：

const useStyles = makeStyles(() => (
  centerAdornment: 
    marginLeft: "50%" // or your relevant measure
  ,
  centerText: 
    textAlign: "center"            
  
));

还有最重要的：

<TextField
    multiline=false
    autoFocus
    placeholder=props.defaultAmt
    helperText=
                  <Typography 
                    variant="caption" 
                    className=classes.centerText
                    display="block"
                  >
                      Enter amount to pay
                  </Typography>
               
    margin="normal"
    InputProps=
        startAdornment: (
            <InputAdornment 
                 position="start"
                 classes= positionStart: classes.centerAdornment
            >
                ₹
            </InputAdornment>
    
/>

【讨论】：

这非常适合文本和占位符。任何使底部文本居中的解决方案？

@user3787635 我也更新了底部文本的答案。

完美！谢谢。据我所知，这不在文档中。你是怎么知道这一切的？抱歉，我是反应和材料 UI 的新手。

@user3787635 欢迎。覆盖规则和类位于 API 部分 here for the textfield 和 here for the InputAdornment 中每个组件的文档中。希望对未来有所帮助。

【参考方案2】：

您可以设置子 div 对齐并减小 TextBox 宽度来实现此目的。创造这样的风格，

const styles = 
   textBox: 
   "& $div": 
        justifyContent: "center",
       "& $input": 
          width: "30%"
        
     ,
   "& $p": 
      alignSelf: "center"
   

;

然后给TextField设置样式

<TextField
   className=props.classes.textBox
   multiline=false
   autoFocus
   placeholder="5000"
   helperText="Enter amount to pay"
   margin="normal"
   InputProps=
       startAdornment: <InputAdornment position="start">₹</InputAdornment>
      
  />

Here 是工作中的 CodeSandbox 示例。

【参考方案3】：

对于帮手，简单做：

<TextField
...
error=isError
helperText=errorMessage
FormHelperTextProps=
  style: 
    textAlign: 'center'
  

/>

【参考方案4】：

hintStyle= width: '600px', textAlign: 'center' 

添加此道具并尝试

【讨论】：

不起作用。它只是将 TextField 的宽度增加到 600px。