タグ

2023年6月27日のブックマーク (6件)

  • コピペで使える!CSSグラデーションジェネレーター20個まとめ | Web Design Trends

    グラデーションはWebデザインに魅力的な雰囲気を生み出してくれる重要な要素の1つです。慣れてくると自分で思い通りに作れるようになりますが、最初はグラデーションの色使いに苦戦する人も多いのではないでしょうか。 今回は、CSSグラデーションがコピペで使える便利なジェネレーターサービスをご紹介したいと思います。 【2024】おしゃれな配色パターンが見つかる!カラーパレット人気ツール30個まとめ 配色はデザインにおいて重要な要素の1つですが、慣れている人でないとバランスの取れた配色を決めていくのは簡単ではありません。 そこで、今回は初心者の方でもおしゃれな配色ができるカラーパレットツール・配色... Web Design Trends コピペで作れる!おすすめのCSSジェネレーター・ツールまとめ CSSがコピペで実装できるおすすめのジェネレーターやツール、サンプルコードなどをまとめました。 CSS

    コピペで使える!CSSグラデーションジェネレーター20個まとめ | Web Design Trends
  • 動くWebデザインアイデア帳

    サイト閲覧方法 1ウェブサイトへアクセス https://ugokuweb.coco-factory.jp/ugokuweb/ 新サイトはこちらから 2【ユーザー名】と【パスワード】が求められますので、以下の情報を入力してください。 【ユーザー名】:ugokuweb 【パスワード】:指定のページ数を【半角数字3桁】で入力 ・黄色をご購入の方: 7-2「検索の表紙」ページ数 ・ピンク(実践編)をご購入の方: 9-4「SVGアニメーションの表紙」ページ数 (例)30ページの場合は 030 と入力 ※ご覧になりたいページ数を入力するのではなく、指定のページ数をご入力下さい。 ※画像と同じページの、左下のページ数をご記入下さい。 3閲覧制限が解除され、サイトを閲覧できるようになります。 ブックマークをしてご利用ください。 ※掲載されているコードは、2021年に出版された時のものをそのまま掲載し

    動くWebデザインアイデア帳
  • CSSボタンデザイン120個以上!どこよりも詳しく作り方を解説!

    なぜCSSでボタンを作るのか?その前に、なぜCSSでボタンを作るのか?について少しだけ考えたいと思います。 簡単に言ってしまえば、 軽い!拡張性がある!解像度の心配がない!簡単!と言った理由ではないでしょうか? 画像でボタンを作ることも多いと思いますが、「画像じゃないほうがいいなあ」と思うことも多いと思います。 もちろん、デザイナーから上がってきたデザインデータからボタンを切り取って、HTMLに設置して、CSSでホバーはopacity:0.8、とかやれば簡単ではありますが、デザインツールの進化やレスポンシブの一般化に伴い、そういったイケてなくて古臭いやり方はあまり望ましくないです。 特にWebの場合、テストの繰り返しが必要ですが、画像でボタンを作るとなるとテスト用にいくつもの画像を作らなくてはいけません。色やテキストを変えるとなると画像すべてを修正する必要があります。しかし、CSSボタンで

    CSSボタンデザイン120個以上!どこよりも詳しく作り方を解説!
  • 一貫1・2年:「すべてはつながっている」の講演会|2023年度|トピックス|明星中学校・高等学校

  • Webサイトやスマホアプリに使用されているさまざまなアイデアを実現する小さなディテールのまとめ -CallToInspiration

    Webサイトやスマホアプリに使用されている、UIのさまざまなアイデアを実現するための小さなディテールをコレクションしているサイトを紹介します。 49種類のカテゴリにUIのディテールがコレクションされており、見ているだけでインスピレーションが刺激されます。 CallToInspiration CallToInspirationは、WebサイトやスマホアプリのUIで見かけた新鮮なアイデアを実現するための小さなディテールをコレクションしているサイトです。ログインからセクションやコンテンツに至るまで、優れたデザインのアイデアはインスピレーションが刺激されると思います。

    Webサイトやスマホアプリに使用されているさまざまなアイデアを実現する小さなディテールのまとめ -CallToInspiration
  • フレックスボックス - ウェブ開発の学習 | MDN

    フレックスボックスの目的。一連のブロック要素やインライン要素を、 1 次元で柔軟にレイアウトすること。 フレックスの用語 — フレックスコンテナー、フレックスアイテム、主軸、交差軸。 既定で display: flex が何をもたらすかを理解すること。 新しい行や列にコンテンツを折り返す方法。 フレックスアイテムを柔軟にサイズ変更したり、並べ替えたりすること。 コンテンツの位置合わせと配置。 CSS フレックスボックスレイアウトでは、以下のことができるようになります。 コンテンツのブロックを、親コンテンツの中で上下中央に配置すること。 利用できる幅や高さに関係なく、コンテナーのすべての子が利用できる幅や高さを等しくすること。 段組みのレイアウトで、コンテンツの量が異なっていても、すべての段の高さが同じになるようにすること。 フレックスボックス機能は、1 次元レイアウトのニーズに最適なソリュ

    フレックスボックス - ウェブ開発の学習 | MDN
    tenchikometen
    tenchikometen 2023/06/27
    flexbox