Useful CSS Text Effects
2014年8月22日 CSS モバイルファーストの概念が広まり、コンテンツ主体の「読ませる」サイトが増えてきた昨今。テキスト周りをより便利に、より素敵に表示できるようなCSSをいくつか集めました。ユーザビリティの向上も図れるようなものもあるので要チェック！基本的なテクニックが中心なので、初心者さん〜中級者さんの参考になればと思います。 ↑私が10年以上利用している会計ソフト！ テキスト周りで使えるCSSの小技 目次 テキストを選択する時の色を変更 蛍光ペンで線を引いたような効果 長いテキストを「…」で省略する 番号リストの表現を変更 リンクの種類でアイコン変える 言語によってスタイルを変更 テキストリンクのエフェクト プリント時はURLを表示 長いURLを途中で折返す 途中で折り返さず、次の行に 先頭の文字を大きく 先頭を一文字分あける グラデーションテキスト ブラウザーは特記していなけれ
固定ヘッダーと合わせて考えたいメインビジュアル | バシャログ。
週末はいろんな苺を食べてきたminamiです。 最近のWebデザイントレンドの１つに固定レイアウトのヘッダー、フッターがありますが、それに影響される形でメインのビジュアル表現もいろいろと考えられているな～と思ったので集めてみました。 固定ヘッダー + 固定カルーセル seedspot.org 「LEARN MORE」の部分の区切り表現も最近多いですね。 USIO Design Project 波型にカットされた区切り線もサイトの印象を強くしています。 株式会社エスアイアソシエイツ スタンダードなカルーセル表現 + 固定位置。ウインドウサイズによってはテキストが見にくくなるので頭が痛いところですね。 固定ヘッダーとの組み合わせで非常に多かったのが、メインビジュアルのカルーセルも固定位置というタイプです。 画面をスクロールしてもビジュアルのイメージを損なうことなく見せられるのがメリットでしょう
[CSS]ごくシンプルなHTMLとCSSで実装するアニメーションがかっこいいメガメニューのデモ
最小限のシンプルなHTMLとCSSで実装する、アニメーションで表示されるメガメニューのデモを紹介します。 デモ：Mega Menuオープン時 HTML HTMLは、トリガーとなるチェックボックス、メガメニューのリスト、コンテンツ、の3つで構成されています。 デモのコードをシンプルにしてみました。 <input type="checkbox" id="nav"> <label for="nav" class="entypo-menu"></label> <nav> <ul> <h2>カテゴリ</h2> <li><a href="#">アイテム</a></li> <li><a href="#">アイテム</a></li> <li><a href="#">アイテム</a></li> </ul> <ul> <h2>カテゴリ</h2> <li><a href="#">アイテム</a></li> <l
個別のHTML, CSS, JS, PHPを追加・管理できるプラグイン -CSS & JavaScript Toolbox | コリス
WordPressで特定のページだけ個別のスタイルシートやスクリプトを使いたい！ しかも1ページだけでも複数のページにも適用する場合がある！ そんな要望を叶えてくれます。 投稿記事、固定ページ、カテゴリページ、カスタム投稿記事に、個別のHTML, CSS, JavaScript, PHPのコードを追加でき、一元管理もできるプラグインを紹介します。 CSS & JavaScript Toolbox CSS & JavaScript Toolbox -WP Plugin Directory 以前、紹介したCustom CSS and JSは記事や固定ページごとにそれぞれ個別のCSS, JavaScriptの外部ファイルやコードを追加できるプラグインで、これは手軽に利用できて便利ですが、今回紹介するのはそれより高機能。 まずは、その画面をご紹介。 当ブログにインストールした画面です。 左パネルで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
