App下載

bootstrap字體顏色怎么設置?代碼分享!

猿友 2021-06-11 14:18:45 瀏覽數(shù) (6146)
反饋

今天我們來看看有關于"bootstrap字體顏色怎么設置?代碼分享!"這個問題,從版本上來看;在2.3版本中使用?.muted?和?.text-error?這兩個屬性來進行樣式字體設置,在3.0的版本中則是換成了?.text-muted?與?.text-danger?來實現(xiàn)。接下來我們來看代碼與截圖;


1.我們首先創(chuàng)建個項目,在項目中加入我們的連接語句:?<link rel="stylesheet" href="dist/css/bootstrap.css">?,在<body>標簽中加入文本,代碼如下;

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<link rel="stylesheet" href="css/bootstrap.css">

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript" src="js/bootstrap.js"></script>

<title>無標題文檔</title>

</head>

<body style="margin:200px">

<div class="container">

<p class="text-muted">這個是text-muted屬性的強調色!</p>

<p class="text-primary">這個是text-primary屬性的強調色!</p>

<p class="text-success">這個是text-success屬性的強調色!</p>

<p class="text-info"> 這個是text-info屬性的強調色!</p>

<p class="text-warning">這個是text-warning屬性的強調色!</p>

<p class="text-danger">這個是text-danger屬性的強調色!</p>

</div>

</body>

</html>

bootstrap字體樣式設計

運行結果我們就可以看到字體都發(fā)生了變化,說明我們成功調用了屬性。


總結:

以上就是有關于“bootstrap字體顏色怎么設置?代碼分享!”這個問題的方法和案例。希望對大家有所幫助。更多的相關內容我們都可以在W3cschool中進行學習和了解!


0 人點贊