タグ

CSSとfirefoxに関するamanoiwatoのブックマーク (4)

  • 最近のWebページで使用されている『さまざまな魅せ方』を実装するCSSやJavaScriptの最新チュートリアルのまとめ

    最近のWebサイトやブログで見かけるアニメーションを使ったさまざまなかっこいいエフェクトやコンテンツの見せ方を実装するCSSJavaScriptのチュートリアルをCodyHouseから紹介します。 それぞれファイルを一式でダウンロードできるので、すぐに利用できます。 Fixed Background Effect デモページ 対応ブラウザ:Chrome, Safari, Firefox, Opera, IE9+ sectionやdivを垂直に配置した縦長ページで、背景を固定し、各コンテンツがカーテンを引き上げるようにスクロールするシンプルなテンプレート。

    最近のWebページで使用されている『さまざまな魅せ方』を実装するCSSやJavaScriptの最新チュートリアルのまとめ
  • Useful CSS Text Effects

    2014年8月22日 CSS モバイルファーストの概念が広まり、コンテンツ主体の「読ませる」サイトが増えてきた昨今。テキスト周りをより便利に、より素敵に表示できるようなCSSをいくつか集めました。ユーザビリティの向上も図れるようなものもあるので要チェック!基的なテクニックが中心なので、初心者さん〜中級者さんの参考になればと思います。 ↑私が10年以上利用している会計ソフト! テキスト周りで使えるCSSの小技 目次 テキストを選択する時の色を変更 蛍光ペンで線を引いたような効果 長いテキストを「…」で省略する 番号リストの表現を変更 リンクの種類でアイコン変える 言語によってスタイルを変更 テキストリンクのエフェクト プリント時はURLを表示 長いURLを途中で折返す 途中で折り返さず、次の行に 先頭の文字を大きく 先頭を一文字分あける グラデーションテキスト ブラウザーは特記していなけれ

    Useful CSS Text Effects
  • 2/3 CSSのborder-radiusで角丸に表示する方法 [ホームページ作成] All About

    発展編:四隅の角丸サイズを個別に指定する書き方 次に、特定の角だけに限定して丸くしたり、角によって丸くする半径を変えたりする書き方をご紹介いたします。この方法を使えば、ボックスの上側だけ(=左上の角と右上の角だけ)を丸くすることで、タブのように見せる装飾も簡単に作れます。 【四隅の角丸を個別に指定する書き方:このページの目次】 四隅の角を個別に丸くするborder-radius関連プロパティ4つの書き方 ボックスの上だけ(右上の角と左上の角)を丸くしてタブを作る方法 ボックスの対角だけを丸くするデザインを作る方法 1. 四隅の角を個別に丸くするborder-radius関連プロパティ4つの書き方 四隅(左上・右上・左下・右下)の角丸半径を個別に指定するプロパティとして、以下に記した4つのプロパティがあります。 border-top-left-radius: 10px; /* 左上 */ b

    2/3 CSSのborder-radiusで角丸に表示する方法 [ホームページ作成] All About
  • ウェブページの高速化に必要なもの

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog こんにちは、オークション事業部のさかいです。 ネットサーフィンに慣れている techblog 読者のみなさんの中には、あちこち見て回っているうちに重いページに行き当たり、イライラしながら応答を待ったり、容赦なくバックスペースキーで前のページに戻ったり…という経験をされた方が多くいらっしゃると思います。 そういったストレスのないレスポンスが行えるよう、バックエンドのプログラムの最適化や、サーバーのチューニングを行うのは私たち技術者の仕事のひとつです。 しかし、あるウェブサイトにアクセスして、そのサイトを閲覧できる状態になるまでの時間のうち、そういったバックエンドでの処理に必要な時間は 1〜2 割でしかないというデータがあります。残り

    ウェブページの高速化に必要なもの
  • 1