###経緯
React.jsの初心者です。Chrome,FireFoxのそれぞれ最新で検証中です。
React.jsではスタイルシート設定もJSとしてコンポーネントに組み込むのが推奨ということで、それに則って以下のように記述しています。
var ApiForm = React.createClass({
render: function(){
var formStyle = {
apiForm: {
borderStyle: "solid",
borderWidth: "1px",
backgroundColor: "#fef4f4",
borderRadius: "60px",
padding: "5px 10px 5px 55px",
margin: " 5px 10px 5px 10px"
},
callButton: {
marginTop: "5px"
}
};
return (
<form style={formStyle.apiForm} >
~~~~省略~~~~
<input type="submit" value="CALL" style={formStyle.callButton} />
</form>
);
}
});
関係ないところは省略しています。上記のスタイル設定は正常に反映されます。
###質問
フォームの背景色に以下のようなCSSでグラデーションをつけたいと考えています。
form{
background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #d5def8), color-stop(1.00, #f2f19b));
background: -webkit-linear-gradient(#d5def8, #f2f19b);
background: -moz-linear-gradient(#d5def8, #f2f19b);
background: -o-linear-gradient(#d5def8, #f2f19b);
background: -ms-linear-gradient(#d5def8, #f2f19b);
background: linear-gradient(#d5def8, #f2f19b);
}
上記をCSSファイルとして静的に読み込んだ場合は正常に反映されます。
しかしこれをReactの記法に則ってjsとして組み込みたいのですが、どうすべきか苦戦しております。
とりあえずchromeだけでも動けばいいと思い、1つづつそのまま組み込んで試したのですが、反映されませんでした。
グラデーションを組み込む際の記載について、何か情報がありましたらご教授頂きたいです。
使用しているReact.jsのバージョンは0.13.3です。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/03/19 04:10