覚えておいて損はない、CSSのみで画像を円形や三角形に切り抜く方法Border-width animation f... / CSSで画像を三角に切り抜く - Weblog ... / The Shapes of CSS他...全3件 円形に切り抜く場合は、border-radius: 50%;（より多くのブラウザーに対応する場合は、ピクセル数で記述）。border-widthの値を遷移させることで使って面白いエフェクトも。
[css] CSS3時代の上下中央に配置するパターン
最近多用するので…。 要素の全画面化について 先に親になる要素を画面いっぱいに広げる方法について補足しておく。 大きく分けると絶対配置とサイズ指定の２つある。 絶対配置は、position:absoluteを指定した上で ４方向の位置を0（または任意の値）にする。 #wrapper { position:absolute; top:0; right:0; bottom:0; left:0; } サイズ指定は、widthとheightを指定するだけだが、 対象の要素だけでなくその親も高さと横幅がないと指定したサイズにならない。 特に高さについての指定がハマりやすい。 単純にbody直下に要素を配置しただけの場合、 <body> <div id="wrapper"></div> </body> htmlとbodyもheightを指定してないと画面いっぱいに広がらない。 html, body,
![[css] CSS3時代の上下中央に配置するパターン](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d71ff5111e05619a10d29bb40d7aebaa75c8fbc/height=288;version=1;width=512/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg)
Edge Animateで作るHTMLモーショングラフィック | ADC - Adobe Developer Connection
新しくリリースされたAdobe Edge Animateは、HTML5を利用したアニメーションを作成できるツールです。本記事では、アニメーションサンプルの作成を通して、Edge Animateの機能を紹介します。 Edge Animateでは、矩形／角丸矩形／楕円などのオブジェクトを描画できるほか、他のツールで作成した画像を読み込むことができます。今回のサンプルの素材は全て、Photoshopなどのツールを利用して作成しました。オブジェクトを重ねて表示する場合は、透過PNGファイルやSVGファイルを利用し、背景など透過の必要がなく容量を節約できる場合はJPEGファイルを利用するとよいでしょう。 画像を読み込むには、メニューから［ファイル］→［読み込み］を選びます。読み込んだ画像はステージ上に配置され、また［ライブラリ］パネルのimagesフォルダーに格納されます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
