Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

Web制作を楽にしてくれるWebサービスで
各パーツを選んでデザインを調整して
HTML、CSSコードをコピペで使えます。
欲しいパーツを簡単に制作できます。

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』
目次

リンク先

CSS Stock リンク先はこちらから

使い方

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

リンク先を開くとたくさんのWebパーツが並んでいます。
ボタンや見出し、ボックスや吹き出しなどブログなどでも役立ちそうです。
またローディングや検索フォーム、セレクトボックスなどWebアプリ制作でも使える
色んなWebパーツが用意されています。

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

記事などでよく使われるリストですが、CSSで使わないとちょっとデザインが古くて
見栄えが良いものを作ると意外と難しいですが、これを使えば簡単にシンプルでおしゃれな
リストを作る事ができます。

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

使いたいパーツを選ぶとデザイン調整の画面が開きます。
出力されたコードを修正するのではなく、画面上で調整が出来るのはありがたいです。
リストでは基調色やタグの種別(ul、ol)、また枠線の有無が選べるようになっています。

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

デザインを調整したら次はHTMLコードが出力されるのでコピペして
表示したい部分に貼り付けます。

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

次にCSSをスタイルシートに貼り付ければ完成です。
リストの名前(list-009)とユニークな名前がついているので、HTMLやCSSでそれぞれ名前を
合わさなくても大丈夫でそのまま使えそうです。

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

メニューでは定番のアコーディオンメニューも簡単に作成できます。
対応しているブラウザも表示されるので安心して使えます。

Web制作が楽になるパーツのデザインを調整してHTML、CSSコード出力、コピペで使えるWebサービス 『CSS Stock』

ブログでも注釈やコメントなどで役立ちそうなボックスを発見しました。
私はそこまで使いませんが時々こういう装飾ボックスを使って機能説明します。
Webページを簡単にオシャレに仕上げてくれると思います。

よかったらシェアしてください!
  • URLをコピーしました!

コメント

コメントする

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

目次