タグ

CSSに関するhiroetteのブックマーク (81)

  • 連載:独学で極める “Webデザイン”の技と心|gihyo.jp … 技術評論社

    運営元のロゴ Copyright © 2007-2025 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します⁠。個別にライセンスが設定されている記事等はそのライセンスに従います。

    連載:独学で極める “Webデザイン”の技と心|gihyo.jp … 技術評論社
  • スペシャルベスト

    免責事項:サイトに含まれる情報は、一般的な情報提供のみを目的としています。情報はスペシャルベストによって提供され、当社は情報を最新かつ正確に保つよう努力しますが、いかなる目的においても、ウェブサイトまたはウェブサイトに含まれる情報、製品、サービス、関連グラフィックスに関する完全性、正確性、信頼性、適合性、利用可能性について、明示または黙示を問わずいかなる表明または保証も行いません。従って、これらの情報に依拠することは、あくまでもお客様ご自身の責任において行われるものとします。 当社は、当ウェブサイトのご利用に起因するいかなる損害についても責任を負いません。 ウェブサイトから、スペシャルベストの管理下にない他のウェブサイトへリンクすることができます。当社は、それらのサイトの性質、内容および利用可能性を管理することはできません。リンクは必ずしも推奨するものではありませんし、リンク先で述べら

  • Devthought - Guillermo Rauch’s Blog » CSS Javascript power. Fancy menu

    Update: the code that empowers this menu has been upgraded to the latest MooTools version, and even improved! Now works with vertical, horizontal menus, with more flexible morphing! Let me introduce you to Fancy Menu: Home Plant a tree Travel Ride an elephant When it comes to creating the navigation part of your Website, the first thing you might think of is an unordered list that you style

    hiroette
    hiroette 2008/01/28
    Fancy menu メニューで、マウスカーソルを移動すると、それに反応して選択エリアが移動する。移動のし方がプルプルしていて面白い
  • CSS Gradient Text - by Web Designer Wall

    jQuery prepend version Note: in this sample the <span> tag is prepended by jQuery (it is not in the source code). Apply on real design See, it is very practical. Try it on your design today. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc euismod adipiscing magna. Quisque sollicitudin nisi a nisi feugiat suscipit. Praesent molestie. Curabitur laoreet, augue in pharetra adipiscing, i

    hiroette
    hiroette 2008/01/28
    CSSで、文字にグラデーションを設定するテクニック
  • How to make sexy buttons with CSS

    This tutorial will teach you how to create pretty looking textual buttons (with alternate pressed state) using CSS. Dynamic buttons save you heaps of time otherwise spent creating graphics and will basically make you a happier person at the end of the day. Here's what you'll get: Sliding doors Since we want our buttons to be über-flexible, we'll have to make the background image expand with the si

    hiroette
    hiroette 2008/01/28
    かっこいいボタンを作るチュートリアル
  • Web標準XHTML+CSSデザイン クリエイターが身につけておくべき新・100の法則。 公式サポートサイト

    重版決定、発行部数が1万3000部を超えました! 7月3日に発売された「Web標準XHTML+CSSデザイン クリエイターが身につけておくべき新・100の法則。」ですが、おかげさまで2度目の重版(第3刷)が決定... 2008年03月29日(土) 21:23 お知らせ 法則15におけるリンクタイプ一覧表の印刷ミスに関して 「法則15 link要素で(X)HTML文書の利便性を高める」(P36~P37)において、P36の下部、リンクタイプ一覧表に印刷ミスがありました。... 2007年08月30日(木) 23:16 訂正情報

  • 実践アクセシブルHTML - フォームは送信してもらえばこそ

    こんなフォームはイヤだ! フォームとは、HTMLのFORM要素などによってマークアップされているコントロール群の塊のことです。さまざまなウェブサイトにおいて、主に問い合わせのページであるとか、サイト内検索のためのキーワード入力用にだとかで利用されています。コミュニティ機能を備えているようなサイトであれば、掲示板システムのようなところでも使われていることでしょう。フォームのないウェブサイトのほうが珍しいのではないでしょうか。それくらい、制作側にもユーザーにも身近なものです。 INPUT要素やTEXTAREA要素などといった、フォームのコントロール各要素の機能はブラウザによって提供されているため、どのようなブラウザであってもその操作感に大きな違いが出ません。しかしコントロールごとの操作に違いが出ないといっても、フォーム全体としてはやはり使いやすいフォームと使いにくいフォームというのがあります。

  • CSSデザインカタログ

    対応ブラウザは Windows:InternetExplorer6,InternetExplorer7,Firefox2,Opera9 Mac:Firefox2,Opera9,Safari2 ですが,ブラウザによって若干表示が異なる部分もあります。 XHTML 1.0 でマークアップしてあります。 DOCTYPEスイッチによる標準モードに対応しています。InternetExplorer6 でXML宣言をし互換モードになった場合にも対応しています。 Netscape7,Mac InternetExplorer5 では期待通りに表示されないものがいくつかあります。 便宜上,分類コード(div011-hp,table010 など)を class名にしてありますが,実際にお使いの際には適切な class名に変更してください。 すでにお使いのCSSファイルに新たにCSSコードを追加した場合,既存

  • リゾレーヌ サプリを口コミだけで判断してはダメ?バストアップ効果が口コミ通りなのか試してわかったことを包み隠さず公開します!

    リゾレーヌ サプリを口コミだけで判断してはダメ?バストアップ効果が口コミ通りなのか試してわかったことを包み隠さず公開します!
  • 強調部分に二重線を引きたい! [ホームページ作成] All About

    強調部分に二重線を引きたい!「文字の下に二重線を引いて強調したい!!」と思ったことはありませんか? 文字を強調する手段は太字だけではありません。スタイルシートを使えば、二重線を引いて強調することもできます。 「ここは、二重線を引いて強調したい!!」と思ったことはありませんか? HTMLで「強調」というと、太字にするくらいしか方法がありません。 斜体ではあまり強調になりませんし、下線ではリンクと間違いやすく紛らわしいでしょう。文字サイズを大きくする方法もありますが、文章中で頻繁に使うと読みにくくなってしまう可能性があります。文字色を変える方法もありますが、モノクロで印刷された場合には強調の効果がなくなってしまいます。 というわけでお勧めなのが、文字の下に二重線を引いて強調する方法です。 印刷物に手描きで強調を書き加える際に、二重線で強調することはありませんか?ウェブ上でも簡単な方法で二重線を

    強調部分に二重線を引きたい! [ホームページ作成] All About
  • リンク先のサムネイルを事前に見せるリンク [ホームページ作成] All About

    リンク先のサムネイルを事前に見せるリンクリンクの上にマウスを載せると、リンク先ページのサムネイル画像やブックマーク数が「吹き出し」に表示される面白いサービスがあります。実際にアクセスすることなくリンク先ページの外観が見えるリンクが作れます。 リンク先にアクセスせずにリンク先の内容を確認させられるサービス 「HeartRails Glance」というサービスを使うと、 リンクの上にマウスを載せるだけで、リンク先ページのサムネイル画像を「吹き出し」に表示させることができます。 Internet Explorer・Firefox・Operaが対象で、JavaScriptを有効にしていれば動作します。 それらのブラウザを使ってリンクの上にマウスポインタを載せると、下図のように「吹き出し」が現れて、リンク先のサムネイル画像などが表示されます。 設置方法は非常に簡単で、指定されたHTMLソース(Jav

    リンク先のサムネイルを事前に見せるリンク [ホームページ作成] All About
    hiroette
    hiroette 2007/09/14
    リンク先にアクセスせずにリンク先の内容を確認させられるサービス
  • WEBデザイン BLOG: css,スタイルシートアーカイブ

    hiroette
    hiroette 2007/03/01
    スタイルシートの色々な技のサンプルサイト
  • outsider reflex

    What's This? つまる所、このサイトは何なのだ? 幼稚な人が思いつくままに色々書いたり描いたり作ったりしたものを置いている場所です。ゴミ捨て場から使えそうな物を探し出す感覚で、何か見つけてもらえれば幸いです。

    hiroette
    hiroette 2007/02/21
    JavaScript版スタイルシート切り替えスクリプト
  • Alexander Sperl

    hiroette
    hiroette 2007/02/20
    CSSを使って、階層になっているサイトマップを作る方法
  • Zoom Zoom Zoom

    Lorem ipsum dolor sit amet Consectetuer adipiscing elit. Curabitur viverra ultrices ante. Aliquam nec lectus. Praesent vitae risus. Aenean vulputate sapien et leo. Nullam euismod tortor id wisi. Sed facilisis, augue in ultrices fringilla, purus nisl euismod nibh, a placerat lacus quam sed elit. Sed purus neque, suscipit vitae, cursus vitae, porttitor non, dui. Mauris volutpat dui vitae sapien. Dui

    hiroette
    hiroette 2007/02/16
    右上にアイコンをおいてテキストの大きさを変える機能が付いているスタイルシート
  • Firebug - Web Development Evolved

    Thank you, Firebug. You made the web amazing for all! The story of Firefox and Firebug are synonymous with the rise of the web. We fought the good fight and changed how developers inspect HTML and debug JS in the browser. Firebug ushered the Web 2.0 era. Today, the work pioneered by the Firebug community through the last 12 years lives on in Firefox Developer Tools. Switch to the latest version of

  • Dive Into Accessibility

    この文書は2つの質問に答えるために書いてみたんだ。 1コ目は、「なんでサイトをアクセシブルにした方がいいのか」。 だから、ここの情報はサイトを持ってない人には向かないかも。 2コ目は、「じゃどうしたらサイトをアクセシブルにできるのか」。 1コ目の答えが納得できるものじゃなかったら、2コ目はどうでもいいってことになるよね。 じゃ行ってみよう。 Dive Into Accessibility(英語版)をダウンロードする HTML英語版)をダウンロード PDF英語版)をダウンロード Dive Into Accessibilityを読む 目次 掲載された順序のままにならべてある、すべての情報はこちら。はじめてココ の文を読むときにおすすめの読み方。 人に基づいた情報分類 ここではどんな人に役立つかによって、情報が分けられています。 障碍に基づいた情報分類 ここではどういった障碍があるときに役立

    hiroette
    hiroette 2007/02/09
    もっとアクセシブルなサイトにする30日計画
  • 53 CSS-Techniques You Couldn’t Live Without | Smashing Magazine

    CSS is important. And it is being used more and more often. Cascading Style Sheets offer many advantages you don’t have in table-layouts - and first of all a strict separation between layout, or design of the page, and the information, presented on the page. Thus the design of pages can be easily changed, just replacing a css-file with another one. Isn’t it great? Well, actualy, it is. Over the la

    53 CSS-Techniques You Couldn’t Live Without | Smashing Magazine
    hiroette
    hiroette 2007/02/02
    CSSを使った色々なテクニックの集大成リンクリスト
  • スタイルシートの技

    スタイルシートの技 このページでは実用的なスタイルシートによるデザイン・レイアウトなどをメインに扱っております。 スタイルシートをサブで使うかメインとするかは賛否両論あります。 また、世の中にスタイルシート解説サイトは多数あると思いますが、 スタイルシートの持つ意味を誤解しているサイトが少なからずあるのと、 リファレンスのような書き方ではデザインへの応用が効かないのでは? という事を考えて、すぐに利用できる実用的な形式で参考になればと思って作成しました。 スタイルシートを勉強すると、当サイトの一番下にある「design」のように、 Javascriptと併用したデザイン切り替えページなどを製作する事ができるようになり、表現の幅が広がります! 自分のスタイルシートの知識を簡単にテストできる問題を作ってみましたので、どうぞ。 Introduction - 基礎・導入編

    hiroette
    hiroette 2007/02/02
  • HugeDomains.com

    Captcha security check hpmania.net is for sale Please prove you're not a robot View Price Processing

    HugeDomains.com