字型樣式的設定
阿新 • • 發佈：2018-11-19
對於頁面的字型內容進行樣式處理,可以採用直接使用js或者jQuery進行處理
<body>
<p id="p1"></p>
<p id="p2"></p>
</body>使用js改變字型樣式
首先通過id獲取元素
var p = document.getElementById('p1'); 設定字型內容
p.innerHTML = '使用js設定字型樣式'; 設定字型屬性
p.style.color = 'red'; //設定字型顏色 p.style.fontWeight="Bold"; //粗體 p.style.fontFamily="楷體"; //設定字型樣式 p.style.background="#aaa"; //設定背景顏色 p.style.fontSize="18px"; //設定字型大小
使用jQuery設定字型樣式
設定字型內容有兩種方式
$('#p2').html('使用jQuery設定字型樣式');
$('#p2').text('使用jQuery設定字型樣式'); 設定字型的屬性
$('#p2').css('color','red'); //設定字型顏色
$('#p2').css('font-weight','bold'); //字型加粗
$('#p2').css('font-family','楷體'); //字型樣式
$('#p2').css('background','#aaa'); //背景顏色
$('#p2').css('font-size','18px');