用 reactjs(px 或 %) 或任何其他方式编写样式的最佳实践是什么?



我需要编写 reactjs 的样式。编写样式的最佳实践是什么。

在反应.js中,% 或 px 的单位更好?

您可以通过多种方式使用这些单元。如果要为元素设置较小的边距,最好使用 px 单位。如果要找到div 以遵循响应方式,% 单位是最佳方法。

总的来说,最好使用 % 单位进行响应,而对于 px 单位则适用于小边距或填充或按钮大小。

我希望这将有助于理解 % 和 px 单位

如果我没猜错,

您可以使用多种方式在 reactjs 中编写样式。

  • 方法1::

    只需声明一个对象,例如样式 = {边距:0 自动,填充:10px 20px,....}

    现在在你的jsx中使用这个对象,就像

    <div style={style} >
    .....
    </div>
    

    像这样,您可以声明尽可能多的对象。

  • 方法2::

    在项目中使用 .css 文件。

    如果您观察您的项目文件结构,则有一个名为App.css的文件。 简单地说,你可以在那里声明你的类,并在jsx中使用它们。

  • 方法3::

    内联样式::

    这种方法的工作方式类似于我们在 CSS 中使用的内联 CSS 机制。

    <div style={{text-align:center,background-color : #eee }} >
    ......
    

*注意::永远记住,我们将一个对象传递给 jsx 中元素的样式 prop。

除了这三种方法之外,还有其他概念,如 CSS 中的伪类。

请浏览一个名为 Laium 的库,以了解有关如何将这些伪类用于 reactjs 组件的更多信息。

相关内容

  • 没有找到相关文章

最新更新