タグ

cssに関するCortelのブックマーク (7)

  • lockエラー | 月額200円からのレンタルサーバー JSN

    まずは最近知って便利だと思ったCSSの小技をひとつ。 文章の最後に、「※(米印)」などで注釈を入れたいときに、CSSのみで行の開始位置を揃えるのにすごくシンプルなやり方がこれ。 .note { padding-left:1em; text-indent:-1em; } <p class=”note”>※米印を使う場合はこいつが便利。<br /> 改行してもこの通り。ちゃんと開始位置が揃ってる。</p> 「padding-left : 1em;」でまず1文字分右に動かして、「text-indent : -1em;」で最初の行だけ1文字分左に出す、ということらしいです。これ考えた人はえらいっすねぇ。 他には開始位置を揃えるいわゆる「ぶら下げ」をCSSでやる場合、<div>タグの入れ子を使ってもいいが、<dl><dt><dd>の定義型リストを使うのがおすすめ。Definition Listの略で

  • bodyに設定しておくと便利な3つのポイントとおまけ|CSS HappyLife

    CSS(スタイルシート)でbodyに設定しておくと便利な5つのポイント - デザインウォーカー | DesignWalker - ロサンゼルスで働くウェブデザイナーの日記を読んで、ボクなりな最初に指定して置くと良いポイントを上げたくなったので書いちゃいます。 むしろこのサイトの方向性的に有った方が便利だよなーと。 書くきっかけを頂き、感謝いたします。 ちなみに、最初に指定しておくポイントってそれぞれだと思うので、一つの参考として読んでいただければ幸いです。 最初にbodyに指定しておくと便利だと思う3つを。 body { background:#FFF url(../img/share/bg.gif) no-repeat left top; font-family:Verdana, "MS Pゴシック", sans-serif; font-size:80%; } じゃあ、詳細について色々書

    bodyに設定しておくと便利な3つのポイントとおまけ|CSS HappyLife
  • TRANS [hatena] - 印刷用CSSをまとめてみた。

    以前、絵文禄のことのはさんのところで、サイトの横幅を640ピクセルにする理由――統計と現状に基づく結論というエントリーがあった。それから、ちょっと印刷用CSSに興味を持って、色々と調べてみたり、自分で書いてみたりした。そのまとめ。 ちなみに、#naviがグローバルナビゲーション、#primaryがメインコンテンツ、#secondaryがサブメニュー、#footerがフッター。 とりあえず、最低限やっておいたほうがよいこと。 body { font-size: 12pt; color: #000000; background-color: #FFFFFF; } a:link, a:visited { text-decoration: underline; color: #000000; } img { border: 0; } 印刷で読まれることを勘案するのなら、font-sizeはある程度

    TRANS [hatena] - 印刷用CSSをまとめてみた。
    Cortel
    Cortel 2006/12/10
  • スタイルシート[CSS]/ページ全般/印刷時の改ページ部分を指定する - TAG index

    avoid の指定は、Opera以外では対応していないようです。 指定例 見出し(h2要素)の直前で改ページさせる例 h2 { page-break-before: always; } 水平線(hr要素)で区切って改ページさせる例 hr { page-break-after: always; } 使用例 h2要素の直前で改ページさせる例 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>文書のタイトル</title> <style type="text/css"> h2 { page-break-before: always; } </style> </head> <body> <h1>印刷時の

    スタイルシート[CSS]/ページ全般/印刷時の改ページ部分を指定する - TAG index
    Cortel
    Cortel 2005/11/27
    これで H1 のまえで改ページできる
  • CodeWeb : 折りたたみナビゲーション風リンク

    対応ブラウザ: IE6.0 / NN7.0 / Mozilla / FF / Opera8 / 他は知らん ツッコミいただいたのでpタグをspanタグに直しました。 改めてDTDでの要素の定義をみたらAタグの中にブロック要素は入れたら駄目となってました。 ありがとうございました。 spanタグにしたのでスタイルはずした時用にbrタグを書いてdisplay:none;で内消しときました。 適当にbrタグにスタイル掛けてみたんですが、brタグってスタイル効くんですね。 普段あんまし使う事ないと思うけど。 手抜きサンプルの日でちょこっと紹介したCSSのhoverを使って遊んでたやつです。 リンクって「link visited hover active」をきちんと定義しないといけなかったような、どうでも良かったような。 例によって適当に書いてる所もあるので、ある程度は脳内補完してください。 サンプ

    Cortel
    Cortel 2005/11/06
  • スタイルシートによる崩れない 2カラム 3カラム・レイアウト

    このウェブサイトは販売用です! desperadoes.biz は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、desperadoes.bizが全てとなります。あなたがお探しの内容が見つかることを願っています!

    Cortel
    Cortel 2005/09/20
  • css Zen Garden: The Beauty in CSS Design

    A demonstration of what can be accomplished through CSS-based design. Select any style sheet from the list to load it into this page. Download the example html file and css file The Road to Enlightenment Littering a dark and dreary road lay the past relics of browser-specific tags, incompatible DOMs, broken CSS support, and abandoned browsers. We must clear the mind of the past. Web enlightenment

    Cortel
    Cortel 2005/07/26
  • 1