タグ

CSSに関するzk3のブックマーク (39)

  • CSS (Sass) のコーディングルール #CSS #Sass - mimemo

    私的(あるいはテンマド社の)CSS/SCSSコーディングについてのルールまとめです。 自分自身の整理/備忘録と、自分の書いたコードを引き継ぐなどしていじることになった人に見せる用。随時更新。 最終更新:2019/09/25 (→ 変更内容 ) ルール設計の指針 覚えるべきことは必要最小限に メンテナンス性の高さを最重要視 開発時に「迷う」「考える」部分を極力減らして余計な事を考えずに済むように 前提 Sassを使う 素のCSSを使うような苦行は避けます。 ほとんど好みの問題ですが、Lessは記法がちょっとよくないので、Sassを使います。 処理速度やツールセットの関係で、RubyのSassではなく、node-sassのほうを、大抵はgulp-sassで走らせて使います。 ※そろそろSassを捨ててPostCSSのみで済ませるのも現実的になってきているので、プロジェクト参加者のCSS知識

    CSS (Sass) のコーディングルール #CSS #Sass - mimemo
    zk3
    zk3 2016/03/24
    書いた
  • HTML5 と CSS3 で 死にたい

    CSS3の「変形・アニメーション関連」のプロパティは面白いですね。これらのプロパティの登場によって、CSSの持つ表現力が「どかーん」と拡大するように感じました。この記事では、WebKit Nightly Buildsでの表示を対象に、 CSS3で新たに定義されたプロパティを色々と使ったサンプルを作ったので、それを紹介したいと思います。 サンプルページは、CSS3のプロパティの練習として作っていたので、 表示の対象はこれらのプロパティを先行実装しているWebKitエンジンのブラウザーの中でも、 描写速度が激的に改善されている開発者向けのWebKit Nightly Buildsになります。 Safari4やGoogle Chromeでも見られますが、アニメーションはスムーズに再生されません。また、HTML5のaudio要素に対応していない場合は音が出力されないようです。非常に高負荷な処理が盛

    zk3
    zk3 2009/08/15
  • Webタイポグラフィまとめ - Archiva

    Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い!情報の正確性は自己責任で判断してください。 フォント指定や行間、約物といった、文字周りのノウハウです。デザインというより技術的なまとめ。SWFObjectとかsIFRといったFlashネタを除けば、Webの文字は全部CSSでできるんだから... コーダこそタイポグラフィを意識すべし。看板みて書体言い当てるとか変態的な域まで達せずとも、原則だけ覚えとけばプロトタイプが様になるんだし。 オールドスタイル数字 アンパサンド(“&”) スモールキャップ ハイフンとダーシ 各種スペース 合字 約物 約物はぶら下げる :beforeと:after 見出しのサイズ 初期フォントサイズ 行間の調整 余白の調節 各国の日付表記

    zk3
    zk3 2009/01/22
  • Mozilla Japan ブログ - Firefox 3 の修正内容のご紹介 その3 ― URLも改行されるように

    Firefox 2 までは日語ではないテキストでは、Web デザイナの方がトリックを使わない限り、半角スペース (U+0020) 以外では改行されませんでした。そのため、長い URL が以下のようにはみ出したり、これが原因で Web ページ全体のデザインが壊れたりすることがありました。 これが、Firefox 3 では以下のように改行されるようになりました。 この修正は、多くの Internet Explorer (以下 IE) 向けにのみデザインされた Web ページの表示を、そのデザイナの意図通りに表示できるようになったことを意味します。 それでは、 Web デザイナの方には細かい仕様や注意点について、少し詳しい解説をさせて頂きます。デザイナの方が気になるのは、IE との互換性かもしれません。しかし、Firefox 3 のレンダリングエンジン、Gecko 1.9 は IE と全く同じ

    zk3
    zk3 2008/06/05
    Firefoxのテキスト改行位置について
  • CSS Redundancy Checker

    Checked 16,806 stylesheets and crawled 49,461 pages since July 24th, 2007 Use this tool to find CSS selectors that aren't used by any of your HTML files and may be redundant. Step 1.Stylesheet URI Step 2. Page URIs (one per line) Step 3.

    zk3
    zk3 2008/04/25
  • Keeping Your Elements’ Kids in Line with Offspring

    CSS selectors are handy things. They make coding CSS easier, sure, but they can also help keep your markup clean. For example, here’s a chunk of code that doesn’t use selectors well: <ul class="products"> <li class="product">Item 1</li> <li class="product">Item 2</li> <li class="product">Item 3</li> </ul> This textbook class-itis leads to messy CSS: ul.products { /* Properties here */ } li.product

    Keeping Your Elements’ Kids in Line with Offspring
  • ie7-js - A JavaScript library to make MSIE behave like a standards-compliant browser. - Google Project Hosting

    Code Archive Skip to content Google About Google Privacy Terms

    zk3
    zk3 2008/01/10
  • Buy fonts from the world�s favorite typography blog, I Love Typography (ILT)

    Part I: Showcase I have spent the last month searching, stumbling, noting, bookmarking and analysing in a quest to find 15 Excellent examples of Web Typography. I’ve chosen them because they make excellent use of type. Some of the examples mimic the typography of print, while others actually leverage web technology, smart CSS and delicious HTML to make their pages not only aesthetically pleasing,

    Buy fonts from the world�s favorite typography blog, I Love Typography (ILT)
  • 栄光ゼミナール;塾選びガイド

    栄光ゼミナールとほかの塾との授業料、サービスなどさまざまなポイントについて比較しています。栄光ゼミナールの授業料、サービスなど充実させたコンテンツで作成していますが、やはり一番栄光ゼミナールを知るには、資料請求が一番です。 栄光ゼミナール資料内容 日程と授業料についてのご案内 栄光ゼミナールの夏期講習のご案内 個別指導のご案内。 「今子供たちは・」資料集栄光ブックレット とっておきなDVD(届くまでお楽しみ) 栄光ゼミナールでは、はじめての方には無料の夏期講習会になります。テキストの教材費は自己負担になりますが、それでも1教科につきたったの2100円。 栄光ゼミナールは特に中学生を対象に向けて圧倒的人気のサービスです。もちろん、それに付随するしっかりとしたサービスがあります。大手の学習塾には、有名講師が授業を100人程度で聞くタイプと少人数制(6人から20人程度)できめ細やかな授業

    zk3
    zk3 2007/06/07
  • フロートとネガティブマージンまとめ:CSS | Tech de Go

    zk3
    zk3 2007/05/21
  • base.cssメモ(初期化と基本設定) - Archiva

    Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い!情報の正確性は自己責任で判断してください。 CSSの初めでUA固有の表示設定を解除するリセットCSSと、フォントサイズ指定、そしてタグ自体の基的な振る舞いを規定する指定、この3つを合わせたもの。 この部分はいつでもどんなサイトでも大抵は使いまわせるので、自分なりのものを用意している人も多いと思います。ちなみにSig.は「base.css」という名前で用意してますが、「default.css」とか「master.css」とかって命名も良く見かけますね。それはともかく。 このところデフォルト設定に関するレポを良く見かけるので、いちど当サイトでも纏めておこうかと思った次第です。(ま~「良い感じの方法を見つけたんだけ

  • CSSセレクタ簡易対応表|CSS HappyLife

    :nth-last-of-type() IE 6:× IE 7:× Fx 2:× Op 9.1:× Sf 2.0.4:×

    CSSセレクタ簡易対応表|CSS HappyLife
    zk3
    zk3 2007/04/16
  • ウノウラボ Unoh Labs: Webサイトのテキストを読みやすくする

    こんにちは! 4月より、デザイナーとしてウノウの末席に加わらせていただくこととなりました。山崎と申します。 周囲が凄いエンジニアの方ばかりで、毎日チビりそうになりながら(?)仕事をしています。 いきなりのラボブログ当番で、さて何を書いたものやら、というところなのですが、このブログをご覧いただいている方々にはエンジニアさんが多いということで、「デザインはよくわからない」と苦手意識を持っている方も少なからずいらっしゃるはず。そんな「デザインとかようわからん」な方々に向けて、Webサイトの「デザイン」について、当にベーシックな部分から少しずつ少しずつ解説してみようと思っています。 すでにガシガシWebデザインをやっている方々には物足りない、退屈な内容になってしまうかもしれませんが、どうぞよろしくお付き合いください。 というわけで今回は、「テキストを読みやすくする」です。 Flashだリッチコ

  • ez-HTML

    充実したカスタマイズ、正確な入力支援、XHTML形式出力も記述ができる高機能・次世代HTMLエディタ。 開発開始からの累計ダウンロード数が100万を突破しました(2022月4月5日)。 最新版(ver 7.71)をダウンロード! (2.20MB) 2005年度 VECTORベストオンラインソフトウェア賞を受賞、 2007年度 Greva!プラチナ賞を受賞しました。 Index 市販の「ウェブサイト制作ツール」(以下WYSIWYGと省略)は画像なども簡単に挿入でき、レイアウトなども簡単にできますが、その反面font要素を乱用したり何度も編集している間ゴミのようにタグが残ってしまうという問題点があります。 当ソフトウェアは主に手打ちでHTMLソースを記述する人向けのために開発されています。 また、WYSIWYGで制作したHTML文書のちょっとした編集などにも使う事ができます。 また、このHT

  • 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
  • CSS Cheat Sheet

    <style type="text/css"> selector {property: value;} </style>

    zk3
    zk3 2007/01/09
  • 體カ豐ウ6163螳俶婿鄂醍ォ� - Apple App Store

    404 - ユメイサオスホトシサソツシ。」 ト昮ェイ鰈メオトラハヤエソノトワメムアサノセウ」ャメムク�クトテ﨤ニサ゚ヤンハアイサソノモテ。」

  • Typetester Compare fonts for the screen

    Design Beautiful Typography One of the most popular applications for web designers is now a full-blown typography editor. Typetester classic that is known and loved by all is still online! Test and compare more than 2800 web fonts. The new Typetester is a WYSIWYG web typography editor. Create, export and share unlimited projects.

    Typetester Compare fonts for the screen
  • Amazon.com

    Счет в символах ведется слева направо, начиная с самого крайнего левого барабана. Стоимость символов и их комбинаций игроки найдут в таблице выплат. Для этого нужно нажать одноименную кнопку на панели управления. Также здесь публикуются правила риск-игры и другие условия слота. Размер ставок, дисперсия и RTP Несмотря на то, что слот вышел еще в далеком 2005 году, RTP составляет 92.13%, что являетс

  • Everything you should know about CSS3 - CSS3.info

    The CSS Working Group has reached an impasse on the issue of percentage margins (and padding) in flex and grid layout, and needs your input to help decide it. Option 1: Flex and grid items resolve percentages in margin-top and margin-bottom against the height of the element’s containing block. Option 2: Flex and grid items resolve percentages in margin-top and margin-bottom against the width of th

    zk3
    zk3 2006/06/13