JSX样式以及注释

在我们写代码的时候，难免要为了代码以后的维护或者调试，需要注释掉某一段代码，或者一些提示信息，那么JSX的注释，是用 {/**/} 来注释。（//双斜杠不知道行不，我没试出来...）
PS：但是这种样式的注释（下面的代码），是在div代码块（一个react组件）内的注释，必须用花括号括起来，如果是在div代码块外的就不需要花括号了
下面的例子

ReactDOM.render(
    /*这是正确的注释*/
    <div>
    /*这是错误的注释*/
    {/*这是正确的注释*/}
        <p>1+1={1+1}    {/*这是正确的注释*/}   </p>
        <p>     {/*1-1={1-1}*/}    </p>
        <p>2*2={2*2}</p>
        <p>4+2={4+2}</p>
        <p>5%3={5%3}</p>
    </div>,
    document.getElementById('demo')
);

输出效果：

捕获.PNG

我们写页面离不开css样式，在JSX里关键字是JS的书写方法比如fontSize,格式是对象的形式，并且尺寸是不需要单位的哦。值的话，只要不是数字都是用字符串的处理方式加上引号或者双引号。另外注意最后的调用样式方法，是：style={}
看个栗子：

var myStyle = {
    width:300,
    height:300,
    fontSize:20,
    paddingTop:50,
    textAlign:'center',
    color:'#fff',
    background:'#000'
}
ReactDOM.render(
    <div style={myStyle}>我是小栗子</div>,
    document.getElementById('demo')
);

输出效果：

样式.PNG

react推荐css样式用内联样式。感觉这样修改组件，比较方便吧。