# @antipodes-medical/material-input 中文文档 规范地址：https://npmcn.com/package/%40antipodes-medical/material-input/ 版本：1\.0\.1 npm 元数据更新时间：2023-04-27T10:47:55.232Z 中文译文更新时间：2026-11-08T09:36:46.319Z 软件包许可：ISC 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40antipodes-medical/material-input 原文对照：https://npmcn.com/package/%40antipodes-medical/material-input/?lang=original 项目主页：https://github.com/antipodes-medical/material-input#readme 源码仓库：https://github.com/antipodes-medical/material-input ## 关键信息（来自 npm 元数据） - 包体积（解压后）：99.3 kB，16 个文件 - 模块格式：CommonJS - TypeScript 类型：未声明 - 运行依赖：1 个 - 首次发布：2022-03-11T16:12:59.505Z - 最新版本发布：2023-04-27T10:47:55.113Z - 近 30 天下载量：1830（2026-10-06 至 2026-11-04，npm 官方下载统计） - 已发布版本数：17（近 12 个月 0 个） ## 中文简介 ![](https://npmcn.com/package/%40antipodes-medical/material-input/docs/material-input.png) ## 安装 ```sh npm install @antipodes-medical/material-input ``` 也可以使用：`pnpm add @antipodes-medical/material-input`、`yarn add @antipodes-medical/material-input`、`bun add @antipodes-medical/material-input` ## README # 物质投入 ![](https://npmcn.com/package/%40antipodes-medical/material-input/docs/material-input.png) ## 安装 ```bash yarn add @antipodes-medical/material-input ``` ```javascript import '@antipodes-medical/material-input'; ``` ## 利用 Il suffit d'insérer l'élément (英语) `` dans votre élément html (英语) `
` 以及游览最优. 非冠军 `` (原始内容存档于2018-10-21) (中文(中国大陆) ). venuelment caché sera créé quiéé ses valeurs avec le `` afin de permetre aux 公式化软件 职业道德规范. ```html ``` ### 输入存在 {\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}没有输入 {\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}没有输入存在 {\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}没有输入 ``. Auvert que l'élément créer un élément (英语) {\\fn黑体\\fs22\\bord1\\shad0\\3ahbe\\4ah00\\fscx67\\fscy66\\2chffffff\\3ch808080}我还不知道 {\\fn黑体\\fs22\\bord1\\shad0\\3ahbe\\4ah00\\fscx67\\fscy66\\2chffffff\\3ch808080}我还不知道. ```html ``` 科特迪瓦 `` 塞内加尔人民解放军 ``。 。 。 . ### 标签 Par défaut, les “物质输入” 使用标签 fottants qui peuvent àtre définies 通过 l'attribut `label`. Cela signifie que le 标签 (原始内容存档于2018-06-26) (英语). resble à un positers, lorsque le champion le est cerré ou rempli, il est déplacé au-dessu du texte de l'uselisateur. ```html ``` ### 占位符 (原始内容存档于2018-09-26) (英语). Vous pouvez user des places oldaux à la place des la la claps, ou en coneinaison avec elles. (原始内容存档于2018-03-26). Si vous choisissez d'utiliser les deux, le 标记为 sera toujours au-dessus du positers si vous choisissez d'utiliser les deux. ```html ``` ### 数值 正常的赛会冠军, 优等优等生 `value` html ou 通过javascript, soit en définissant 职业介绍所 `value`。 。 。 . ```html ``` ```javascript // javascript document.querySelector('material-input.animal').value = 'cat'; document.querySelector('material-input.animal').setAttribute('value', 'cat'); ``` ### 验证 校对:Soup `` (法语) 阿约特斯·恩 `required` 欧德菲尼塞斯 `type` 小时 `email` 声音 航行验证通知。 德加, 莱昂特 `material-input` aura 取消样式 `valid` 尔 `invalid`。 。 。 . De plus, il est de définir explainment un Champione comme étant 可能指名道姓的共和党人 `invalide` 妇女发展委员会 `setCustomValidity` 小时 玛特丽尔 瓦斯·普韦斯 萨瓦斯加拉 国家行动 [mDN 上的自定义变量](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation#Controlling_the_text_of_constraints_violation) 。 。 。 . ```javascript document.querySelector('material-input.customValidatedItem').setCustomValidity('This is not valid.'); ``` #### 后端验证 (原始内容存档于2012-10-12). Si vous viousez vos 公式化通过votre后端(ce que vous devriez faire!), vous pouvez ajouter untrobut `invalid` 尔 `valid` 页:1 `material-input`. Cela metra le champion dans l'état d'éfini. 中国植物物种信息数据库. #### 错误消息 伏斯·普韦斯·德菲尼尔·阿特特鲁布特 `message`{\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}这才是冠军 Il'agit toujours d'un message d'erreur, quel quel 克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克克 所以,我被击败了,冠军. #### 自动验证 洛斯克·克洛斯·克洛斯·克洛斯·克洛斯·克洛斯·克洛斯·克洛斯·克洛斯 `autovalidate` 亲友会 `material-input`冠军万岁 `keydown`{\\fn黑体\\fs22\\bord1\\shad0\\3aHBE\\4aH00\\fscx67\\fscy66\\2cHFFFFFF\\3cH808080}不愧是.., cala signifie qu'un champion sans règles de 验证 sera toujours 有效与再分配 l'attribut `valid`。 。 。 . ## 自定义样式 ```css /* select your specific input or all */ material-input.some-class { /* the text font family of the input */ --material-input-text-font-family: inherit; /* the text font size of the input */ --material-input-text-font-size: 1em; /* the text letter spacing of the input */ --material-input-text-letter-spacing: inherit; /* the text font weight of the input */ --material-input-text-font-weight: inherit; /* the text color of the input */ --material-input-text-color: black; /* the padding of the input */ --material-input-text-padding: 1.4em 1em .6em 10px; /* the text color of the placeholder or the floating label on an empty field */ --material-input-placeholder-color: grey; /* the color of the border and label when the field is focused */ --material-input-highlight-color: indigo; /* the color of the border and label when the field is in an invalid state */ --material-input-invalid-color: red; /* the color of the border and label when the field is in a valid state */ --material-input-valid-color: green; /* the default color of the bottom border */ --material-input-border-color: orange; /* the height of the bottom border when the field is not focused */ --material-input-line-height: 1px; /* the height of the bottom border when the field is focused */ --material-input-highlight-line-height: 3px; /* The placeholder left */ --material-input-placeholder-left: 10px; /* The placeholder top */ --material-input-placeholder-top: 1.42em; } ``` ## 常见问题 ### 如何安装 @antipodes-medical/material-input？ 在项目目录运行 npm install @antipodes-medical/material-input，或使用 pnpm add / yarn add / bun add。 ### @antipodes-medical/material-input 支持 TypeScript 吗？ 该包的 package\.json 没有声明类型入口。需要类型提示时，可以在 npm 上查找社区维护的 @types/antipodes-medical\_\_material-input 是否存在。 ### @antipodes-medical/material-input 支持 ESM 还是 CommonJS？ 以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。 ### @antipodes-medical/material-input 可以商用吗？ @antipodes-medical/material-input 使用 ISC 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。 ### @antipodes-medical/material-input 的下载量有多少？ 根据 npm 官方下载统计，@antipodes-medical/material-input 在 2026/10/06 – 2026/11/04 这 30 天内被下载 1,830 次，日均约 61 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @antipodes-medical/material-input 还在维护吗？ 最新版本 1\.0\.1 发布于 2023/04/27（3 年前）；至今共发布 17 个版本，其中过去 12 个月发布了 0 个；首次发布于 2022/03/12。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。