如何设置NiceGUI框架中ui.input组件的宽度？

在NiceGUI中，无法通过JustPy风格的size参数调整输入框宽度，正确设置方式有以下几种：

方法1：用style参数直接指定CSS宽度 #

通过style属性传入CSS宽度规则，支持像素、百分比等单位：

from nicegui import ui

ui.input(label='自适应父容器80%', placeholder='输入内容', style='width: 80%;')
ui.input(label='固定宽度300px', placeholder='输入内容', style='width: 300px;')

ui.run()

方法2：借助Tailwind CSS类（NiceGUI默认集成） #

NiceGUI内置Tailwind CSS，可直接使用其宽度类快速设置：

from nicegui import ui

# 使用Tailwind预设类：w-full占满父容器，w-3/4为75%宽度，w-[300px]自定义像素宽度
ui.input(label='占满父容器', placeholder='w-full', classes='w-full')
ui.input(label='75%宽度', placeholder='w-3/4', classes='w-3/4')
ui.input(label='300px固定宽', placeholder='w-[300px]', classes='w-[300px]')

ui.run()

方法3：通过父容器间接控制宽度 #

将输入框嵌套在布局容器（如卡片、行容器）中，通过调整容器宽度约束输入框：

from nicegui import ui

with ui.card(style='width: 400px;'):
    ui.input(label='受卡片宽度限制', placeholder='继承父容器宽度')

ui.run()

补充说明：NiceGUI基于Quasar框架开发，组件样式控制遵循Quasar+Tailwind的CSS逻辑，和JustPy的参数设计不同，因此需要用CSS相关方式调整宽度。

内容的提问来源于stack exchange，提问作者Wolfgang Fahl