react样式的写法总结

2022/3/3 23:17:54

本文主要是介绍react样式的写法总结,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

一、标签行内样式写法:

<h2 style={{textAlign:"center",fontFamily:"黑体"}}>react</h1>
//行内标签样式要用双括号,如遇见两个单词就要第二个单词首字母大写驼峰命名

二、内部声明样式写法

const a={
  border:"1px solid black",
   width:"200",
  margin:"auto"
}

const b=<div style={a}>react</div>;

//js内部写样式就声明变量对象,像css一样写法 然后在stye属性上用单花括号进行绑定值对象

三、外部引用

//index.less
.main{
  border:"1px solid black"
}
//组件引入
import style from  from '.index.less' 
import './index.less'; //不配置cssModel 只需要less编译(我们常用的)

<h2 className={style.main}> react</h2>
<h2 className="main">不配置css解析器</h2>

//less语言有判断写法非常适合开发

绑定dom写法:

使用 ref="list"来进行绑定,获取时就用this.refs来获取进行操作



这篇关于react样式的写法总结的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程