CSS最適化／CSS整形

CSS

CSS最適化／CSS整形

　状態:不明 　閲覧数:6,504 　投稿日:2010-04-18 　更新日:2011-08-06
■CSS最適化オンラインツールの性能比較
CSS最適化ツールとしてはCSS Tidy系がバランスが良く、またどのようにオプションを設定しても見た目が破綻することなく、使いやすいと思います、と紹介されている。
▼ゆっくりと… » CSS最適化オンラインツールの性能比較 (2)
　 http://tokkono.cute.coocan.jp/blog/slow/index.php/xhtmlcss/evaluate-online-css-optimizer-2/


■2011.2.1追記
◎方法１．ProCSSorを利用
オプション
▽Properties of a Rule
　 On Separate Lines
▽Indent Properties
　 2 Spaces
※整形対象CSS内に、@charset "utf-8";があると、正常に動作しないため、一時的に外しておく。
▽ProCSSor - Advanced CSS Prettifier
　 http://procssor.com/

○方法２．DreamweaverでCS整形
コマンド
　　↓
ソースフォーマットの適用
※「ソースフォーマットの適用」自体が、選択できない場合がある。理由不明。

▼2011.8.6.追記
どういうルールでフォーマットが適用されるか、
フォーマットルールの変更は、こちら
「編集」－「環境設定」－「環境設定」－カテゴリ「コードフォーマット」－高度なフォーマット「CSS(S)」をクリック

サイトにプログラムコードを貼り付ける preタグのCSS

使用していないCSSをチェックする、標準的な方法を知りたい



類似度ページランキング
順位 ページタイトル抜粋 ％
1 CSS最適化／CSS整形 67
2 CSS管理効率化のために 25
3 OOCSS 24
4 CSS仕様書 22
5 CSS色指定 22
6 CSSセレクタ 21
7 HSV ／ HSB 19
8 CSSで出来ないこと 18
9 フォーム要素に対する(私の)CSS適用ルール 18
10 CSS選択範囲非表示対応 17
11 CSSで画像をロールオーバー 15
12 SCSS × Windows 15
13 「CSSプロパティ」書く順番 15
14 CSSのみで交互色 … リスト 15
15 「OOCSS」とは別の考え方？ 15
16 背景CSS シームレスパターン 15
17 CSSだけでボーダーを内側に引く 14
18 (私の)CSSコーディングルール 14
19 Private リセットCSSテンプレ ／ CSS圧縮Link 14
20 遠近グリッド はCS3にはないの？ 14
2026/10/31 10:10 更新
週間人気ページランキング ／ 10-24 → 10-30
順位 ページタイトル抜粋 アクセス数
1 Design 0 15
2 「bgcolor」「background-color」「background」の違い | CSS 9
3 鉄道会社毎のカラーコード | カラーコード(色) 5
4 カラーコード ／ 色コード | カラーコード(色) 4
4 「東京都」のカラーコード取得は難しい | カラーコード(色) 4
5 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 3
5 Stylus(Chrome 拡張機能) カテゴリー 3
5 「display:flex;」を設定している「
  • タグ」内の「タグ」クリック範囲を拡大する | Flexible Box Layout Module(CSS)
    		• 3
    5 右クリック出来るのに、コピペ出来ないWebページ。2020 年 | ブラウザ 3
    6 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 2
    6 HSLとHSVの違い | 色変換(色) 2
    6 縦横比が16:9となる整数値の組み合わせ 2
    6 「Midjourney」を使用してみた感想。2022 年 8 月 2 時点では、画像生成能力自体は素晴らしいと思いますが、UIが致命的に分かりづらかったです。 | AI画像生成 2
    6 Chromeブックマーク ショートカット | Chromeブックマーク(ブラウザ) 2
    6 ユーザー個別の設定情報が格納されているレジストリキーを削除 2
    6 レスポンシブサイトにおけるスマホ表示用画像指定 2
    6 「transform:translate3d();」でスマホ実機画面が一瞬だけチラつく → 「backface-visibility:hidden;」指定すると解消される | CSSトラブル対応(CSS) 2
    6 画像 2
    6 Windows10で「Google Chrome」が常に最前面に表示される。「アクティブウィンドウ」が最前面で表示されない → 解決方法存在しない | Google Chrome(ブラウザ) 2
    6 Adobe Camera Raw 4.0 | Photoshop 2
    2026/10/31 5:05 更新