react行内样式

2017-03-15  本文已影响0人  LElysion

react的行内样式本质上是一个对象,比如官方文档的这个

var divStyle = {
  color: 'white',
  backgroundImage: 'url(' + imgUrl + ')',
  WebkitTransition: 'all', // 注意这里的首字母'W'是大写
  msTransition: 'all' // 'ms'是唯一一个首字母需要小写的浏览器前缀
};

React.render(<div style={divStyle}>Hello World!</div>, mountNode);

如果打算直接写在标签上的话,更简单,不过就是看着比较多,用style={{}}就可以的

<div className="" 
                style={{marginBottom:"5px"}}
                value={ user.userName } 
                onChange={this.onTextChange('username').bind(this)}></div>

不过需要注意的是这个里面这个属性名需要使用小驼峰写法style={{marginButtom:"5px"}}
没法像css那样写margin-bottom:5px

上一篇 下一篇

猜你喜欢

热点阅读