タグ

ブックマーク / www.webcreatorbox.com (6)

  • 【第3弾】少しのコードで実装可能な15のCSS小技集

    2022年4月27日 CSS CSS小技集シリーズの第3弾!「【第2弾】少しのコードで実装可能な20のCSS小技集」から3年が経ち、さらに便利でサクッと使えるコードが続々登場!特にこれまではJavaScriptで実装していたものがCSSだけで実現できるようになったりと、進化が凄まじいです。初心者さんからベテランさんまで要チェック! ↑私が10年以上利用している会計ソフト! 目次 スムーズスクロール スクロールスナップ スクロールすると要素を固定 画像をトリミング CSSで計算式を書く テキストを円形に回り込ませる Webフォントを使った時の表示遅延を回避する テキストに波線を引く テキストの上に記号を表示 表のセルの幅を統一する 入れ子になったリストもカウントする フォームのプレースホルダーの文字色を変更 しましまのライン メディアクエリーを使わずにタイル型レイアウトをレスポンシブに対応

    【第3弾】少しのコードで実装可能な15のCSS小技集
  • Webデザインを「もっとかっこよくして!」と言われた時に試したいCSS小技5つ

    2017年10月11日 CSS, Webデザイン Webデザイン・制作を教えている時に、担当していた生徒さんからこんな悲痛なメッセージをいただきました。「Webサイトのデザインを出してみたものの、気を出して作ってくださいと言われてしまいました…」。デザインを見てみると、とても美しく整ったものだったのですが、「テンプレートとしてありがち」なレイアウトに見えました。この辺を指摘されたのかな、と。自分でコーディングをすることを考えると、どうしても自分の力で実現できそうなデザインにしてしまうんですね。私も駆け出しの頃はよくありました。そこで今回はちょっとした工夫で少し差がつくCSSの小技をいくつか紹介します。簡単にできるとわかれば、デザインに反映できそうですね! ↑私が10年以上利用している会計ソフト! 1. 要素を斜めに配置 通常CSSでレイアウトを組んでいくと、垂直平行のボックスが並んでいく

    Webデザインを「もっとかっこよくして!」と言われた時に試したいCSS小技5つ
  • かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技

    2015年3月18日 CSS 2011年に「少しのコードで実装可能な20のjQuery小技集」という記事で数々の便利な制作技を紹介したのですが、時は流れ、今ではCSSのみで表現できるものが多くなってきました。という事で今回はその記事内で紹介した技を中心に、かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる小技を紹介します。 ↑私が10年以上利用している会計ソフト! 目次 Div全体をクリックできるようにする テーブルの偶数・奇数の行の色を変える フォームにテキストを入れておき、フォーカスで消す(文字色も変更) ラジオボタンとチェックボックスを装飾する スライドパネル アコーディオン ツールチップ 言語によってスタイルを変更 横並びのdivの高さ揃える ボックスを上下左右中央に配置する それでは実際にどんな事ができるのか見てみましょう!サンプルも作ったのでコードと

    かつてはJavaScriptを利用していたものの、今ではCSSのみで実装できる10の小技
  • Webにも紙にも使える、囲み枠デザインの基本テクニック

    2016年1月20日 Webデザイン テキストを四角で囲ったシンプルな枠。もちろんWebだけでなく、印刷物でも多く使われていますよね。今回は、デザインをする上では欠かせないと言っても過言ではないこの囲み枠にフォーカスしてみようと思います。新米デザイナーさんや、デザイナーじゃないけど資料作成をする機会の多い営業さんの参考になれば幸いです! ↑私が10年以上利用している会計ソフト! 呼び方は「囲み枠」で正しいのか…謎ですが、テキストを囲んでいるボックスのことです。海外では「パネル」「テキストボックス」等と呼ばれています。 こんな時に使うと◎ 強調する時 「今なら20%オフ!」「期間限定!」等、注目して欲しい要素に利用されます。Webサイト上ではアラートメッセージでよくみかけますね。図はBootstrapのアラート要素。 要素の差別化 補足や注意書きなど、メインのコンテンツと区別して表示したい時

    Webにも紙にも使える、囲み枠デザインの基本テクニック
  • Webデザイナーさんにおすすめの無料で読める電子書籍いろいろ

    2014年2月25日 Web関連記事, インスピレーション 私は普段紙のをほとんど読みません。年に1冊読むか読まないか…。しかし、iPadを購入してからはなぜか電子書籍なら読むようになりました。ディスプレイで読む事の方が慣れているからですかね…?という事で私が最近読んだ無料の電子書籍をいくつか紹介します。日語のものは比較的サクサク読めるものばかりなので、空いた時間に読んでみてください! ↑私が10年以上利用している会計ソフト! インタラクティブPDFでつくったインタラクティブPDFのつくりかた〜動画/音声再生・ページ効果編〜 ダウンロード InDesignで動画や音声付きのPDFファイルの作り方を説明してます。サンプルもついています。紙のでは表現できない、電子書籍の魅力はこういった点にあると思うので、これから電子書籍の出版を考えている人には参考になると思います。 地域でメディアづくり

    Webデザイナーさんにおすすめの無料で読める電子書籍いろいろ
  • 生活をもっと便利に・楽しくしてくれる無料Webサービスいろいろ | Webクリエイターボックス

    2017年6月30日 便利ツール 「こんな事がネットでできると便利なのになあ」と思った事はありませんか?生活に「便利」「楽しみ」をくれるサービスが無料であれば嬉しいですよね!ということで、今回はWebに詳しくない人でも簡単にはじめられるWebサービスを紹介します。中には会員登録も不要なものも!今直ぐ試してみてください! ↑私が10年以上利用している会計ソフト! ファイルシェア Sendoid Sendoid 会員登録不要のファイル送信サービス。ファイルをアップロード後にURLが生成されます。パスワード設定可。おすすめです! イベントスケジュール ATND(アテンド) ATND(アテンド) イベント・カンファレンス・勉強会の告知や参加者管理が簡単にできるサービス。イベントの詳細を入力したり、参加予定者がコメントしあったりできます。TwitterGoogleYahoo、Mixiなどでログイ

    生活をもっと便利に・楽しくしてくれる無料Webサービスいろいろ | Webクリエイターボックス
  • 1