タグ

CSSとcssに関するdelphieのブックマーク (7)

  • スマートフォンサイト制作時に覚えておきたいCSS 15

    スマートフォンサイトを制作する際、個人的に覚えておいた方が良いと思うCSSのプロパティやテクニックをまとめてみました。 自分用の備忘録ではありますが、他のブログ等でも取り上げられていることが多いので、いずれも覚えておいて損はないものだと思います。 普段から制作している方にとっては目新しいのはないと思いますが、まだスマートフォンサイトを制作したことがない方やまだまだ苦手だなと思う方は参考にしてみてください。 UA切り替え・Viewport指定・拡大縮小の有無・電話番号リンクの無効化・ホーム画面用のアイコン指定など、スマートフォンサイトを制作する際に最低限覚えておくべきと思うことは他にも沢山あるんですが、今回はCSSに焦点を当てています。 また、タイトルでは「スマートフォンサイト制作時」としてはいますが、レスポンシブWebデザイン制作時でも頻繁に使うものだったり、PCサイト制作時でもCSS3に

    スマートフォンサイト制作時に覚えておきたいCSS 15
    delphie
    delphie 2014/05/20
  • 2014年のリセットCSSとレスポンシブ対応の初期CSS

    スマホ・タブレット対応、レスポンシブ対応が一般的な現在、CSSの扱いは非常に重要になっているように感じています。今回こそはと思ってサイト制作を始めても気が付いたらグチャグチャなCSS。 2014年もCSSを上手く綺麗に扱うのに苦労しそうです。そこで、ここではリセットCSSに合わせて、効率良くスマートに扱うための初期CSSHTMLを大公開。 年末ということで、過去のデータを整理してみました。 個人的な資産ですが、まぁ何と言うか誰かの役に立てたら幸いです。紹介するCSSは大きく分けて下記の4つです。 2014年もきっと大活躍のリセットCSS よく使うCSS3 WordPress用の初期CSS レスポンシブ対応、どんなサイトでも使えるレイアウト早組CSS リセットCSSというか、もはやフレームワークです。 2014年のリセットCSS 色々なリセットCSSが出回っていますが、個人的には下記で十分

    2014年のリセットCSSとレスポンシブ対応の初期CSS
    delphie
    delphie 2014/05/19
  • Youtubeの動画を背景に

    Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp

    Youtubeの動画を背景に
  • Google HTML/CSS Style Guide

    Revision 2.1 This style guide contains many details that are initially hidden from view. They are marked by the triangle icon, which you see here on your left. Click it now. You should see “Hooray” appear below. Hooray! Now you know you can expand points to get more details. Alternatively, there’s a “toggle all” at the top of this document. This document defines formatting and style rules for HTML

  • iPad用HTML5アプリを作成するときに知っておいた方がいいCSSに関するTips - [モ]Modern Syntax

    さて、モダシンラジオのデータをホスティングしてもらっているSpotify for Podcasters(旧Anchor)の私のページはこちらです。 https://podcasters.spotify.com/pod/show/kazuyoshi-nagasawa このSpotify for PodcastersページのRSSは以下になります。こちらのRSSではenclosureタグなどでlength値などがしっかり入っているのでこれを購読しておくとよいかと思います。 https://anchor.fm/s/66ff2830/podcast/rss ここで聴く!という人は以下のプレイヤーからどうぞ。 んで、これまではGoogle Drive上に保存したmp3ファイルを聞きたい方は以下のリンクをクリックしてください。ブラウザ内で聞けます。 https://drive.google.com/f

  • Free Online CSS Beautifier / Formatter - Styleneat

    What does Styleneat do exactly? It organizes and standardizes your CSS - selectors, sub-selectors and properties - in a structure that makes it easier to define page areas and see how they relate to each other. So, for example, it turns this: #id1 { property: value; } #id1 .class1 { property: value; } #id1 .class1 a { property: value; property2: value2; property3: value3; } #id1 .class1 a span { p

  • Firebug用リファレンスツール「Firescope」

    サイト構築の際、欠かせないツールのひとつといえば Firebug。JavaScript を使ったウェブアプリケーションのデバッグだけでなく、サイトデザインをしている方にとっても便利なツール。テストの際、レイアウトが崩れていたとしても Firebug で調べればだいたいのことは解決します。この Firebug のコンパニオンツールが Firescope です。 Firescope は、Firebug 内で CSS/HTML のタグの意味や使い方をチェック出来るツール。インストール後、Firebug のパネルに新たに「Reference」というタブが追加されます。HTMLビューや「調査」の際に選択したタグと下階層にあるタグの意味が Reference に表示されます。最新のブラウザだけですが、その場でサポート状況も見れるのは便利です。もっと詳しく知りたい方は提供元の Sitepoint のペー

    Firebug用リファレンスツール「Firescope」
  • 1