スポンサーリンク
基本図形

五角形 – css Pentagon –

「五角形」の描画。borderを使った例とbackgroundを使った例です。borderを使った例html<divclass="pentagon"></div>css.pentagon{position:relative;width:50...
基本図形

星形 – css Star –

「星形」の描画。borderを使った例です。html<divclass="star"></div>css.star{position:relative;width:0;height:0;border-right:50pxsolidtrans...
基本図形

平行四辺形 – css Parallelogram –

「平行四辺形」の描画。borderを使った例とbackgroundを使った例です。「Parallelogram」って知りませんでした・・・borderを使った例(縦1)html<divclass="parallelogram_up"></d...
基本図形

台形 – css Trapezoid –

「台形」の描画。borderを使った例とbackgroundを使った例です。「Trapezoid」って知りませんでした・・・borderを使った例(上)html<divclass="trapezoid_up"></div>css.trape...
基本図形

三角形2 – css triangle –

「三角形」の描画。borderを使った例とbackgroundを使った例です。borderを使った例(左上)html<divclass="triangle_left_up"></div>css.triangle_left_up{width:...
基本図形

三角形 – css triangle –

「三角形」の描画。borderを使った例とbackgroundを使った例です。borderを使った例(上)html<divclass="triangle_up"></div>css.triangle_up{width:0;height:0;...
基本図形

楕円形 – css oval –

「楕円形」の描画。値の指定で角丸から楕円まで出来ます。また、borderの使い方で色々と出来そうです。html<divclass="oval"></div>css.oval{width:160px;height:100px;backgrou...
基本図形

円形 – css circle –

「円形」の描画。値の指定で角丸から正円まで出来ます。また、borderの使い方で色々と出来そうです。htmlhtml<divclass="circle"></div>css.circle{width:100px;height:100px;b...
基本図形

長方形 – css rectangle –

「長方形」の描画。基本何もしておりませんが、borderの使い方で色々と出来そうです。html<divclass="rectangle"></div>css.rectangle{width:160px;height:100px;backgr...
基本図形

四角形 – css Square –

「四角形」の描画。基本何もしておりませんが、borderの使い方で色々と出来そうです。html<divclass="square"></div>css.square{width:100px;height:100px;background-c...
cssの基本

transform: rotate (要素の回転)

マウスを乗せてくださいtransform:rotateプロパティは「要素の回転」を指定する場合に使用します。html<divclass="square_transform_rotate"></div>css/*四角形 回転*/.square...
cssの基本

radial-gradient (円形グラデーション)

radial-gradientプロパティは「円形グラデーション」を指定する場合に使用します。html<divclass="square_radial_gradation"></div>css.square_radial_gradation{...
cssの基本

linear-gradient (線形グラデーション)

linear-gradientプロパティは「線形グラデーション」を指定する場合に使用します。html<divclass="square_gradation"></div>css.square_gradation{width:100px;he...
cssの基本

box-shadow (影)

box-shadowプロパティは「ボックス要素に影」を指定する場合に使用します。html<divclass="square_box_shadow"></div>css.square_box_shadow{width:100px;height...
cssの基本

border-radius (角丸)

border-radiusプロパティは「角丸」を指定する場合に使用します。html<divclass="square_border_radius"></div>css.square_border_radius{width:100px;hei...
cssの基本

border (枠線)

borderプロパティは「枠線」を指定する場合に使用します。html<divclass="square_border"></div>css.square_border{width:100px;height:100px;background-...
cssの基本

background-color (背景色)

background-colorプロパティは「背景色」を指定する場合に使用します。html<divclass="square"></div>css.square{width:100px;height:100px;background-col...
スポンサーリンク