HTMLDOMスタイルのfontFamilyプロパティ
HTML DOMスタイルのfont-familyプロパティは、選択した要素の特定のフォントリストを設定または返すために使用されます。 Webセーフフォントを使用し、追加のフォントを指定することをお勧めします。
以下は、-
の構文です。fontFamilyプロパティの設定-
object.style.fontFamily = "font1, font2, etc.|initial|inherit"
ここで、font1、font2はコンマ区切りのフォントリストです。最初のフォントを適用できない場合は、2番目のフォントが適用されます。 Initialはプロパティ値をデフォルト値に設定し、inheritはそれを親プロパティ値に設定します。
fontFamilyプロパティの例を見てみましょう-
例
<!DOCTYPE html>
<html>
<head>
<style>
li{
font-size: 1.1em;
background-color: snow;
font-family: cursive;
}
</style>
<script>
function changeFontFamily() {
for(var i=0;i<3;i++){
document.getElementsByTagName("li")[i].style.fontFamily="Sans-Seriff";
}
document.getElementById("Sample").innerHTML="The font family for the above list is now set to Helvetica";
}
</script>
</head>
<body>
<ul>
<li>This is list item 1.</li>
<li>This is list item 2</li>
<li>This is list item 3</li>
</ul>
<p>Change the above list items font family by clicking the below button</p>
<button onclick="changeFontFamily()">Change Font Family</button>
<p id="Sample"></p>
</body>
</html> 出力
「フォントファミリの変更」をクリックすると 」ボタン-
-
HTMLDOMスタイルlistStylePositionプロパティ
HTML DOMスタイルのlistStylePositionプロパティは、リストアイテムマーカーの位置を設定または返すために使用されます。 以下は、-の構文です。 listStylePositionプロパティの設定- object.style.listStylePosition = "outside|inside|initial|inherit" 上記の特性は次のように説明されます- 値 説明 外部 これはデフォルト値であり、テキストの前にリストアイテムマーカーを配置します。 内部 これにより、リストアイテムマーカーが少し内側にイン
-
HTMLDOMスタイルlistStyleImageプロパティ
HTML DOMスタイルのlistStyleImageプロパティは、画像をリストアイテムマーカーとして設定または返すために使用されます。 以下は、-の構文です。 listStyleImageプロパティの設定- object.style.listStyleImage = "none|url|initial|inherit" 上記の特性は次のように説明されます- 値 説明 なし これはデフォルト値であり、画像は表示されません。 url 画像パスを指定します。 初期 このプロパティを初期値に設定します。 継承 親