HTML5 BuilderのCSS3 Property Editorでボタンのデザインを編集してみる

HTML5 BuilderのCSS3 Property Editorでボタンのデザインを編集してみました。

ボタンを配置します。

オブジェクトインスペクタで、「BorderRadius」プロパティの「…」ボタンを押します。

「CSS3 Property Editor」が表示されます。

スタイルのブルダウンメニューから枠線のスタイルを選択します。

幅のスライドバーを移動して、枠線の幅を設定します。

画面右側のプレビューはすぐに更新されます。

半径を変更すると、角の丸いボタンを作ることができます。

色の「…」ボタンを押すと「Color Selector」が表示されます。

枠線の色を選択すると、枠線の色が更新されます。

「CSS Property Editor」の「OK」ボタンを押して、設定を登録します。

デザインモードでもちゃんと設定が反映されています。

ブラウザで表示したところ。

他にもTextShadowプロパティで文字に影をつけたり、Transformプロパティで回転させたり、など簡単にできます。

CSSについての詳しい知識がなくても、簡単に編集することができました。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください