ブログスキンのタグまとめ

ブログスキン」のタグがついている新着記事と人気記事をまとめました。エキサイトブログにはブログスキンに関連するブログ(日記、記録、写真、レビュー、噂、まとめ)がたくさん投稿されています。

「ブログスキン」タグの記事(66)

  1. Chrome DevTools を使ってみよう (17) - At Studio TA

    Chrome DevTools を使ってみよう (17)

    背景画像の設定は、ページデザイン上で必ず必要になります。 テクスチャーの利用や、ネット速度の向上で、最近は大きい画像を背景にする事も多くなっています。 今回はその基礎になるテストです。 以下のテスト手順は、実際のアレンジのテスト作業にも応用できると思います。Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょ...

  2. Chrome DevTools を使ってみよう (17) - At Studio TA

    Chrome DevTools を使ってみよう (17)

    背景画像の設定は、ページデザイン上で必ず必要になります。 テクスチャーの利用や、ネット速度の向上で、最近は大きい画像を背景にする事も多くなっています。 今回はその基礎になるテストです。 以下のテスト手順は、実際のアレンジのテスト作業にも応用できると思います。Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょ...

  3. Chrome DevTools を使ってみよう (16) - At Studio TA

    Chrome DevTools を使ってみよう (16)

    DevTools を使い慣れた人には自明の事かも知れませんが、DevToolsのウインドウ設定の基本を整理します。 〔 DevTools のウインドウ設定 〕  Chrome画面とDevTools 同居か別居か DevToolsの右上、「︙」メニューの最初で、「Chrome画面とDevToolsが同じウインドウ」❶ か、「Chrome画面とDevToolsが別ウインドウ」❷ かが選択出来ます...

  4. Chrome DevTools を使ってみよう (16) - At Studio TA

    Chrome DevTools を使ってみよう (16)

    DevTools を使い慣れた人には自明の事かも知れませんが、DevToolsのウインドウ設定の基本を整理します。 〔 DevTools のウインドウ設定 〕  Chrome画面とDevTools 同居か別居か DevToolsの右上、「︙」メニューの最初で、「Chrome画面とDevToolsが同じウインドウ」❶ か、「Chrome画面とDevToolsが別ウインドウ」❷ かが選択出来ます...

  5. Chrome DevTools を使ってみよう (15) - At Studio TA

    Chrome DevTools を使ってみよう (15)

    今回は実践編です。 実際に私がスキンアレンジをした経過の順を追ってレポートします。私は、「右クリック禁止」のブログパーツを利用しています。 コピー禁止などは全く考えになく、画像の拡大視をスマートに実現したいからです。 今までの基本的な設定は以下を参照ください。で、この今までの設定で、少し気になっていたのが、このブログパーツの「CLOSE」の表示です。 どこをクリックしても抜けられるので無くて...

  6. Chrome DevTools を使ってみよう (15) - At Studio TA

    Chrome DevTools を使ってみよう (15)

    今回は実践編です。 実際に私がスキンアレンジをした経過の順を追ってレポートします。私は、「右クリック禁止」のブログパーツを利用しています。 コピー禁止などは全く考えになく、画像の拡大視をスマートに実現したいからです。 今までの基本的な設定は以下を参照ください。で、この今までの設定で、少し気になっていたのが、このブログパーツの「CLOSE」の表示です。 どこをクリックしても抜けられるので無くて...

  7. Chrome DevTools を使ってみよう (14) - At Studio TA

    Chrome DevTools を使ってみよう (14)

    ネット上の優れたデザイン手法を見て、それを自分も使いたいと思う場合があります。 そのデザインをDevToolsで調べて、もしCSSの技術のみで実現したものなら、自分のページでも同じ事が出来る可能性があります。 今回は、デザインの輸入です。Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 デザインを...

  8. Chrome DevTools を使ってみよう (14) - At Studio TA

    Chrome DevTools を使ってみよう (14)

    ネット上の優れたデザイン手法を見て、それを自分も使いたいと思う場合があります。 そのデザインをDevToolsで調べて、もしCSSの技術のみで実現したものなら、自分のページでも同じ事が出来る可能性があります。 今回は、デザインの輸入です。Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 デザインを...

  9. Chrome DevTools を使ってみよう (13) - At Studio TA

    Chrome DevTools を使ってみよう (13)

    Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 小数値を「↑」「↓」で調整 〕 下図は、タイトル部に「opacity」というプロパティの「値」を設定している所です。「opacity」は要素の表示上の透過率を指定するもので、この指定が無い場合の値は非透過「1.0」です。 この値が「1.0」より小さ...

  10. Chrome DevTools を使ってみよう (13) - At Studio TA

    Chrome DevTools を使ってみよう (13)

    Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 小数値を「↑」「↓」で調整 〕 下図は、タイトル部に「opacity」というプロパティの「値」を設定している所です。「opacity」は要素の表示上の透過率を指定するもので、この指定が無い場合の値は非透過「1.0」です。 この値が「1.0」より小さ...

  11. Chrome DevTools を使ってみよう (12) - At Studio TA

    Chrome DevTools を使ってみよう (12)

    Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 HTMLを編集する 〕  テキストデータの編集 タイトル文字のデサイン上の修飾は、CSSで実現出来ます。 しかし、タイトル文字の文言自体の内容を変える事はHTMLの編集になります。 ここでは、タイトル文字のテキストを編集してみます。タイトル部をター...

  12. Chrome DevTools を使ってみよう (12) - At Studio TA

    Chrome DevTools を使ってみよう (12)

    Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 HTMLを編集する 〕  テキストデータの編集 タイトル文字のデサイン上の修飾は、CSSで実現出来ます。 しかし、タイトル文字の文言自体の内容を変える事はHTMLの編集になります。 ここでは、タイトル文字のテキストを編集してみます。タイトル部をター...

  13. Chrome DevTools を使ってみよう (11) - At Studio TA

    Chrome DevTools を使ってみよう (11)

    Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 ウインドウ幅をコントロールする 〕  ウインドウ幅を知る必要性 自ブログをどの様なウインドウ幅で見てもらうのか、それを小型のノート画面を前提にするか、幅広いデスクトップモニターを前提にするか、ここはスキンデザインの要所です。例えば、Chromeのウ...

  14. Chrome DevTools を使ってみよう (11) - At Studio TA

    Chrome DevTools を使ってみよう (11)

    Toolsの編集画面の説明は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 ウインドウ幅をコントロールする 〕  ウインドウ幅を知る必要性 自ブログをどの様なウインドウ幅で見てもらうのか、それを小型のノート画面を前提にするか、幅広いデスクトップモニターを前提にするか、ここはスキンデザインの要所です。例えば、Chromeのウ...

  15. Chrome DevTools を使ってみよう (10) - At Studio TA

    Chrome DevTools を使ってみよう (10)

    Toolsの編集画面は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 elements.style 項 〕  HTMLにstyleを書き込むのと等価 DevToolsの右ウインドウの「Styles」タブの一番上にある「elements.style { }」は、余り出番がありません。 最初に1個だけ用意されたこのエリアは、他...

  16. Chrome DevTools を使ってみよう (10) - At Studio TA

    Chrome DevTools を使ってみよう (10)

    Toolsの編集画面は以下のページをサンプルにしています。 実際にDevToolsを操作しながら読まれると、いっそう判り易いでしょう。 〔 elements.style 項 〕  HTMLにstyleを書き込むのと等価 DevToolsの右ウインドウの「Styles」タブの一番上にある「elements.style { }」は、余り出番がありません。 最初に1個だけ用意されたこのエリアは、他...

  17. Chrome DevTools を使ってみよう (9) - At Studio TA

    Chrome DevTools を使ってみよう (9)

    DevToolsの右ウインドウでの編集に慣れて来ると、間違い記入で放棄したり無効化したプロパティや、余計に作ってしまったCSS項などが多くなりがちです。 不要プロパティは、行頭のチェックボックスをOFFにして放置で良いのですが、編集結果の書き出しをする時などは、綺麗に整理してからコピーしたい場合もあります。ここでは、それら不要な編集ゴミの「削除の方法」をまとめます。Toolsの編集画面は以下...

  18. Chrome DevTools を使ってみよう (9) - At Studio TA

    Chrome DevTools を使ってみよう (9)

    DevToolsの右ウインドウでの編集に慣れて来ると、間違い記入で放棄したり無効化したプロパティや、余計に作ってしまったCSS項などが多くなりがちです。 不要プロパティは、行頭のチェックボックスをOFFにして放置で良いのですが、編集結果の書き出しをする時などは、綺麗に整理してからコピーしたい場合もあります。ここでは、それら不要な編集ゴミの「削除の方法」をまとめます。Toolsの編集画面は以下...

  19. Chrome DevTools を使ってみよう (8) - At Studio TA

    Chrome DevTools を使ってみよう (8)

    DevToolsの右ウインドウにマウスポインタを持って行き、右下の「︙」のマークにマウスをポイントすると、下の様に5つの機能メニューが出ます。 今回は右端の「Insert Style Rule Below」の機能の説明です。 これは、新規にCSS項を作るスイッチですが、機能はTools右ウインドウの右上の「New Style Rule」と同じです。ただ、新しいCSS項の作られる場所が、右ウイ...

  20. Chrome DevTools を使ってみよう (8) - At Studio TA

    Chrome DevTools を使ってみよう (8)

    DevToolsの右ウインドウにマウスポインタを持って行き、右下の「︙」のマークにマウスをポイントすると、下の様に5つの機能メニューが出ます。 今回は右端の「Insert Style Rule Below」の機能の説明です。 これは、新規にCSS項を作るスイッチですが、機能はTools右ウインドウの右上の「New Style Rule」と同じです。ただ、新しいCSS項の作られる場所が、右ウイ...

1 - 20 / 総件数:66 件

似ているタグ