bootstrap字体颜色怎么设置?代码分享!

2021-06-11 14:18:45 浏览数 (2)

今天我们来看看有关于"bootstrap字体颜色怎么设置?代码分享!"这个问题,从版本上来看;在2.3版本中使用​.muted​和​.text-error​这两个属性来进行样式字体设置,在3.0的版本中则是换成了​.text-muted​与​.text-danger​来实现。接下来我们来看代码与截图;


1.我们首先创建个项目,在项目中加入我们的连接语句:​<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字体样式设计

运行结果我们就可以看到字体都发生了变化,说明我们成功调用了属性。


总结:

以上就是有关于“bootstrap字体颜色怎么设置?代码分享!”这个问题的方法和案例。希望对大家有所帮助。更多的相关内容我们都可以在W3cschool中进行学习和了解!


0 人点赞