タグ

2024年8月3日のブックマーク (5件)

  • 商用可・フリーイラスト素材|ソコスト

    商用可のシンプルでかわいいフリーイラスト素材集。画像・ベクター形式でDL!色変更可能!Web・広告・企画書・資料などご自由に!

    商用可・フリーイラスト素材|ソコスト
    matea
    matea 2024/08/03
  • Webサイトでよく使用されるUIコンポーネントをコピペで簡単に実装できる -IndieUI

    Webサイトでよく使用されるグリッド、カード、ボタン、ヘッダ、セパレータなどのUIコンポーネントをコピペで簡単に実装できるコードをまとめたIndieUIを紹介します。 たとえばボタンだと、基となるベースのボタンをはじめ、シンプルなものからトレンドを取り入れたもの、きらめき効果や光沢感やグラデーションをアニメーション化したボタンなどが揃っています。 Indie UI Indie UI -GitHub IndieUIの特徴 IndieUIで実装したUIコンポーネント IndieUIの使い方 IndieUIの特徴 IndieUIはWebサイトでよく使用されるUIコンポーネントを迅速かつ最小限の労力で構築するのに役立つコードをまとめたサイトです。コードをコピペするだけで簡単に実装できます。 IndieUIUIコンポーネントには、シンプルなものからトレンドを取り入れたものまで揃っており、必要に応

    Webサイトでよく使用されるUIコンポーネントをコピペで簡単に実装できる -IndieUI
    matea
    matea 2024/08/03
  • 日本語におけるtext-wrapプロパティの運用

    CSStext-wrapプロパティを使うと、テキストの行の折り返し方法を変更できる。text-wrap: balanceを適用すると、適用しない場合と比べて次のように変化する。 CSS text-wrap: balance  |  CSS and UI  |  Chrome for Developers text-wrap: balanceが適用された下の例では、すべての行の長さが均等になるように制御されている。 しかし正確に言えば、すべての行の長さが必ずしもまったく同じになるわけではない。文字の適切な折り返し位置を考慮した上で、おおよそ同じくらいの長さになるように分配される、というのが正しい。その際、一つの英単語の途中で行が分割されるようなことは通常起こらない。これは、英語では単語の区切りに空白文字を挟んで記述されるが(わかち書き)、それが改行位置を決めるためのヒントとなるからである。

    日本語におけるtext-wrapプロパティの運用
    matea
    matea 2024/08/03
  • 全国各地の自治体ホームページが閲覧できなくなる障害 | NHK

    30日午前、全国各地の自治体のホームページが閲覧できなくなる障害が起きました。その後、順次復旧し、各自治体はホームページの管理を委託している会社と連絡をとって原因を調べています。 三重 名張市 復旧も原因を調査 このうち三重県名張市では、30日午前8時ごろ、市のホームページが閲覧できなくなっていることに、職員が気付いたということです。 ホームページは民間のシステム会社が所有するサーバー上に設けられ、この会社にシステムの管理を委託していて、市によりますとサーバーで不具合が発生したということです。 ホームページのアドレスにアクセスすると、「エラー」と表示される状態になり、システム会社で復旧作業を進め、昼すぎに復旧しました。 不具合の詳しい原因はわかっていないということで、原因を調べています。 福岡県でも30日午前中、糸島市と大野城市、それに粕屋町の3つの自治体のホームページが閲覧できなくなりま

    全国各地の自治体ホームページが閲覧できなくなる障害 | NHK
    matea
    matea 2024/08/03
  • HTMLとCSSでつくる! リンクテキストのホバー時アニメーション11選 - ICS MEDIA

    テキストをホバーしたときの変化やアニメーションをつくることは、どのようなサイトをつくっていてもほぼ必ず行う工程ではないでしょうか。 テキストがリンクであることをユーザーに伝えるという点では、ブラウザのデフォルトスタイルのような下線のみで十分な場合もあると思います。 しかしそれだけではなく、変化をつけてよりわかりやすくしたい場合や、サイト全体の雰囲気に合わせたい場合にちょっとしたアニメーションが効果的です。 今回はHTMLCSSのみで作成できる、シンプルながら少し目を引くアニメーションをテーマに実装例を紹介します。 ▼今回紹介する実装例一覧 とくに、以下のようなデザイナー/エンジニアにとって参考になれば嬉しいです。 HTMLCSSのみでどのようなホバー時のアニメーションができるのか知りたい 透明度の変化や、下線のつけ外し以外の実装例の引き出しを増やしたい ※今回の実装例では主にヘッダー/

    HTMLとCSSでつくる! リンクテキストのホバー時アニメーション11選 - ICS MEDIA
    matea
    matea 2024/08/03