Javascript 呈现应用于无状态函数语句的css样式

我试图在React.js中呈现用无状态函数组件编写的组件。当我试图呈现下面的代码时，元素没有显示出来。正确插入React和React Dom脚本文件

const showMe=（）=>{
返回(
)
};
render（showMe、document.getElementById（“目标”）
#目标{
位置：绝对位置；
左：0；
右：0；
保证金：0自动；
最高：50%；
转化：translateY（-50%）；
边框：1px纯红；
宽度：600px；
高度：500px；
}
.嗨{
边框：1px纯蓝色；
位置：绝对位置；
宽度：50%；
身高：40%；
左：0；
右：0；
保证金：0自动；
最高：50%；
转化：translateY（-50%）；
}

ReactDOM.render（，document.getElementById（“目标”）；

const ShowMe=（）=>{
返回(
)
};
render（，document.getElementById（“目标”）
#目标{
位置：绝对位置；
左：0；
右：0；
保证金：0自动；
最高：50%；
转化：translateY（-50%）；
边框：1px纯红；
宽度：600px；
高度：500px；
}
.嗨{
边框：1px纯蓝色；
位置：绝对位置；
宽度：50%；
身高：40%；
左：0；
右：0；
保证金：0自动；
最高：50%；
转化：translateY（-50%）；
}

它应该是
，您应该使用大写的组件名称，如
。此外，HTML文件中必须有一个id为
target
的DOM元素。啊，所以使用大写首字母不仅是为了方便，还是语法的一部分？谢谢你的建议！谢谢你的回答。我也尝试过这种语法，但仍然不起作用：（JSX组件的第一个字母使用大写字母就是答案！谢谢大家！
ReactDOM.render(< ShowMe />, document.getElementById("target"));