コラム

Web制作Tips

submitボタンのデザインをCSSで変える方法

2022年06月8日
submitボタンのデザイン変更

メールフォームなどで送信する際のボタン、submitボタン。デフォルトのままでは少しデザインが物足りないですよね。 そこでCSSでデザインを変える方法をお教えします。 まずはHTML 次にCSS このようにCSSで指定し […]続きを読む⇒

フレックスボックスdisplay: flex;を使ったレイアウト

2022年05月26日
フレックスボックスdisplay: flex;を使ったレイアウト

Webサイトの制作に横並びにする場面は何度も出てきますよね。横並びにする方法はいくつかありますが、今回はフレックスボックスでの横並びを説明します。非常に簡単なのでぜひ使ってみてください。 実際のCSSをご覧ください この […]続きを読む⇒

CSSで画像の角を丸くする方法

2022年05月10日
CSSで画像の角を丸くする方法

Webサイト上で画像を表示させる際に角を丸く表示したいときがあると思います。この場合、Photoshop等で予め画像を加工する方法もありますがCSSでもできますので参考にしてください。 コードは以下になります。クラス名は […]続きを読む⇒

display:inline-blockで横並びした時に出るスペースを無くす方法

2022年05月9日
インラインブロック

ブロックが画像を横並びする方法はいくつかありますが、dispay:inline-blockを使った場合、各ブロック要素の左右にマージンを0、またはautoにしても変なスペースができてしまいます。それを解消する方法は以下に […]続きを読む⇒