[英]Best way to implement css
In some parts of my code I need to use the same css for some elements, but it is repetitive and the same code is used several times, and it looks meshy in html it looks something like this.在我的代码的某些部分中,我需要对某些元素使用相同的 css,但它是重复的,并且多次使用相同的代码,并且在 html 中看起来像这样。
<p style="color: red; height: 50%;">orange</p>
<p style="color: red; height: 50%;">apple</p>
It is the same code repeated several times, so I would like to know the best way to implement a css, which is easier and more understandable.相同的代码重复了几次,所以我想知道实现一个 css 的最佳方法,它更容易理解。
const ItemPage = () => {
const item = ({name}) => <p style={{
color: 'red',
height: '50%'
}}>{name}</p>;
return(
<div>
<item name='orange'/>
<item name='apple'/>
</div>
)
}
I think the best way to use css more efficiently is to create a separate file and then use it wherever you want to use it instead of repeating the code over and over again我认为更有效地使用 css 的最佳方法是创建一个单独的文件,然后在任何你想使用它的地方使用它,而不是一遍又一遍地重复代码
I would suggest you create a new CSS
file我建议你创建一个新的
CSS
文件
Write this in the CSS
file if you want to style
all <p>
tags.如果要设置所有
<p>
标记的style
,请将其写入CSS
文件中。
Example:例子:
p {
color: red;
height: 50%;
}
If you want to just style
those two <p>
tags implement a class
and name it whatever you want and add it to your <p>
tag.如果您只想设置这两个
<p>
标记的style
,请实现class
并将其命名为您想要的任何名称并将其添加到您的<p>
标记中。
Example:例子:
.style-p {
color: red;
height: 50%;
}
<p className="style-p">apple</p>
Then you just import the file to your current .js
file然后您只需将文件导入当前的
.js
文件
I would suggest doing the same as the previous answer, but if you're looking for example to make all paragraphs center aligned add this code to your HTML
File:我建议与上一个答案相同,但如果您正在寻找使所有段落居中对齐的示例,请将此代码添加到您的
HTML
文件中:
<style>
p {
text-align: center;
}
</style>
And that will make all paragraphs center aligned.这将使所有段落居中对齐。 Best Of Luck
祝你好运
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.