タグ

designとCSSに関するpicnicgraphicのブックマーク (5)

  • タグクラウドのサンプル作ってみた

    タグとかめんどーだから、入れる気無かったんですけど、今更になって悪くないかも?とか思い始めたので、試しにタグクラウド設置してみました。 トップページの下の方におりますが、あんまり古いエントリーとか、タグ付け自体が適当だったりするので、あんまり使い物にならないかもしれません。。。永遠のベータ版です。 で、まぁかっこ良さげなタグクラウドを頑張ってつくろーとkiai出して作ってる途中に、ふと3ping.orgさんを思い出し、過去記事をあさってたらTag Cloudのスタイルというエントリーがありました。 んで、被ってる感じバリバリだからいっかーとか思ったんですけど、何となく作っちゃったんで公開っていう流れです。えぇ。 にしても3つほど作ったら疲れました。 ダウンロードとか実際の表示を見たい方は以下より。 サンプルの実際の画面 サンプルダウンロード(zip:17kb) スタイルシート タグクラウド

    タグクラウドのサンプル作ってみた
    picnicgraphic
    picnicgraphic 2008/03/11
    その1がドットでかわよい(少ないタグほど上に来る工夫)。その2はfirst-letterを利用したデザイン(一見さんが探しやすそう)。
  • Tag Cloudのスタイル - 3ping.org

    タグクラウドの必要性についての是非はここでは置いておいて、このアイテムのデザインって色々考えさせられますね。 Vicuna CMSでも真面目に対応しようと重いケツを上げましたので、とりあえずサンプルとなるCSSスタイルを色々と書いてみました。 表示例とCSSファイルを置いておきましたので、気に入った表示があったらどうぞ使って下さい。 2007.10/21 追記・編集 Tag Cloud 10,11,12で.level5のフォントサイズが.level4と同じになってたのを修正 応用編としてTag Cloud 13を追加 単純に該当する記事が多いタグが他より目立てばいいだけなので、大抵のスタイルは大小の区別で表示しているけど、それだけじゃちょっと味気ない気もするので サイズ 色 明暗 彩度 色彩 形 というところでタグの強弱をより強調してみました。 HTMLは以下のような要素とクラス名で作って

    picnicgraphic
    picnicgraphic 2007/10/22
    Tag Cloud11の背景とすき間の感じがアナログちっくになってかわよい。
  • Online CSS Scrollbar Color Changer

    Online CSS Scrollbar Color Changer Change the scrollbar colors in an HTML page Use the controls below to change the color of your HTML scrollbars for Internet Explorer. Enter your colors in hex format, e.g. "FF0033" or click the color chip for a popup color picker. The CSS for the scrollbars that you create is displayed automatically below. Copy it into your HTML page to easily change the scrollba

    picnicgraphic
    picnicgraphic 2007/10/04
    「スクロールバーのデザインをWYSIWYGで確認しつつデザイン」できる/via*phpspot開発日誌さん
  • optgroup 要素を CSS でひと工夫してみる | WWW WATCH

    フォームの入力コントロールの中で、select 要素によるセレクトメニューは、選択肢の数が一定以上増えると選択したい項目を探し出すのがちと面倒になります。そんな... フォームの入力コントロールの中で、select 要素によるセレクトメニューは、選択肢の数が一定以上増えると選択したい項目を探し出すのがちと面倒になります。そんな時のために optgroup 要素が存在するわけですが、こいつを使用した上で、CSS をあてて見た目を装飾する方法と、一部ブラウザでの注意点などを簡単にまとめてみました。 基的なことのみで、すごいかっこいい見た目を実現とかそういうのではありませんので、期待せずにどうぞ。 例えば都道府県などの選択をさせる際を想定すると、マークアップ自体はこんな感じになりますよね。面倒なので全部は書きませんが。 <select name="location"> <optgroup la

    optgroup 要素を CSS でひと工夫してみる | WWW WATCH
    picnicgraphic
    picnicgraphic 2007/06/26
    Fxなどでは背景画像も表示できる・optgroup要素へのborderやpadding指定が反映/Operaはoptgroup要素のlabel属性値をデフォルトだと白い文字色で書き出すので注意。
  • OverZone Software - CSS Tab Designer

    Create killer menus effortlessly! CSS Tab Designer is a unique and easy to use software to help you design css-based lists and tabs visually and without any programming knowledge required! With the CSS Tab Designer, you can : Quickly design your list visually Choose from a variety of styles/colors (60+ different designs/colors supported). [ Styles Authors / Credits ] Generate strict xhtml complian

    picnicgraphic
    picnicgraphic 2006/11/28
    「60を超えるデザインの中から好きなデザインのタブを選択するだけであっという間にタブ部分ができます」
  • 1