今注目のニュース
林眞須美死刑囚の息子が明かす「僕が母の無実を信じた」理由
温泉が浴槽ごと来てくれる、移動できる別府温泉・“幻想の湯”が完成
竹中平蔵「今の日本人は童貞男子とそっくりだ」

ニコニコ大百科:HTML各要素のデフォルトCSS単語

ニコニコダイヒャッカエイチティエムエルカクヨウソノデフォルトスタイリングシート

  • 50
  • 0
掲示板をみる(19)
  • twitter
  • facebook
  • はてな
  • LINE
  • ほめる(50)
  •  
  •  
  •  
  •  
  • その他

この記事では、ニコニコ大百科の記事におけるpやh2など各要素のデフォルト値についてまとめる。

記事全体に反映されるもの(各要素に反映されるもの)

フォントサイズ font-size
0.9em
ブラウザ定したフォントサイズの0.9em(90%)の大きさで表示します。また、各要素のフォントサイズ定やline-height(行の高さ)定にも影します。

例えば、既定のフォントサイズ20pxのブラウザh2見出しを見た場合
見出し2の文字の大きさは 20(px)×0.9(em)×1.4(em)=25.2(px)
見出し2の行の高さは 20(px)×0.9(em)×1.4(em)×1.4=35.28(px)
となります。
スマホ版
14px
行の高さ line-height
1.35
line-heightを個別に定していない項全てに適用されます。
スマホ版
140%
文字color
通常文字#303030;  
リンク文字#0066cc;  
マウスオーバー#ff8800;  
1文字記事自動リンクあり #444;  
背景background-color
white  
方向の表示位置 text-align
left
直方向の表示位置 vertical-align
baseline
横幅 width
720px
左右に10pxずつのpaddingが設定されている。なお左右共に外側2pxずつは記事用に使用している為、背景画像の使用時などは注意が必要。
←10pxのpadding
10pxのpadding
720px
スマホ版
max-width
100%

各端末毎に異なる表示可な幅に対応するためh2, h3, h4, h5, h6, hr, img, div, table, p, pre, blockquoteに対して定されている。imgタグにwidthとheightを定していた場合などにwidthの値のみがmax-widthの適用により狭められ縦長に表示されてしまう場合がある。
左右に4pxずつのpaddingが設定されている。

各要素のプロパティ

<p>

margin: 1em;
<p>の本文領域
margin: 1em;
<p>の本文領域
margin: 1em;

<h2>

<h2>の本文領域

margin部分  
padding部分  

<h3>

<h3>の本文領域

margin部分  
padding部分  

<h4>

<h4>の本文領域

margin部分  
padding部分  

<h5>

<h5>の本文領域

margin部分  
padding部分  

<h6>

<h6>の本文領域

margin部分  

<hr>


<table>

<th>

<td>

<th>の本文領域
<td>の本文領域

padding部分  

<blockquote>

<blockquote>の本文領域

margin部分  
padding部分  

<ul>

<ul><ul>

<ul><ul><ul>

  • <ul>の本文領域
    • <ul><ul>の本文領域
      • <ul><ul><ul>の本文領域

padding部分  

<ol>

<ol><ol>

<ol><ol><ol>

  1. <ol>の本文領域
    1. <ol><ol>の本文領域
      1. <ol><ol><ol>の本文領域

padding部分  

<dl>

<dt>

<dd>

<dt>の本文領域
<dd>の本文領域

margin部分  
padding部分  
<dd>のpadding-left部分  

<sup>

examplesup

<sub>

examplesub

<ins>

exampleins

<del>

exampledel

関連項目

掲示板

ニコニ広告誘導

急上昇ワード

最終更新:2019/10/23(水) 17:00

ほめられた記事

最終更新:2019/10/23(水) 17:00

☆オススメの関連コンテンツ

動画

この記事名で動画を検索

静画(イラスト)

この記事名で静画を検索

ニュース

この記事名でニュースを検索

ウォッチリストに追加しました!

すでにウォッチリストに
入っています。

OK

追加に失敗しました。

OK

追加にはログインが必要です。

           

ほめた!

すでにほめています。

すでにほめています。

ほめるを取消しました。

OK

ほめるに失敗しました。

OK

ほめるの取消しに失敗しました。

OK

ほめるにはログインが必要です。

タグ編集にはログインが必要です。

タグ編集には利用規約の同意が必要です。

TOP