引入Bootstrap的CSS样式后,<h>标签、<p>标签等HTML自带的标签被覆写没有?答:覆写了。

引入Bootstrap的CSS样式后,标签、

标签等HTML自带的标签被覆写没有?答:覆写了。

为什么这么说?证据呢?

写一个实例,然后调试模式看一下不就得了。

先看没有引入引入Bootstrap的CSS样式情况。

代码如下:

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>使用标题类</title>
    <meta name="viewport" content="width=device-width,initial-scale=1, shrink-to-fit=no">
</head>
<body>
	<h1>这是一个未引入bootstrap的CSS样式的h1标题</h1>
</body>
</html>

我们用浏览器打开上面的代码,然后F12进入调试模式,发现h1的样式如下:

可见,这个h1使用的是客户端的样式。

再看引入了Bootstrap的CSS样式的情况。

代码如下:

html 复制代码
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>使用标题类</title>
    <meta name="viewport" content="width=device-width,initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="bootstrap-4.5.3-dist/css/bootstrap.css">
    <script src="jquery-3.5.1.slim.js"></script>
    <script src="bootstrap-4.5.3-dist/js/bootstrap.min.js"></script>
</head>
<body class="container">
	<h1>这是一个引入了Bootstrap的CSS样式的h1标题</h1>
</body>
</html>

我们再次用浏览器打开上面的代码,然后F12进入调试模式,发现h1的样式如下:

我们再点击上面截图中的 _type.scss 文件,得到源文件如下:

可见,这个_type.scss 文件是来自于bootstrap的。

我们再用相同的内容,对比下两种样式,如下图所示:

很明显,二者的样式是不一样的。说明引入Bootstrap的CSS样式后,<h>标签、<p>标签等HTML自带的标签被覆写了。

那么在引入Bootstrap的CSS样式后,有哪些HTML自带的标签被覆写了呢?

这就只有慢慢收集了...

目前知道的有<h>标签、<p>标签,以后发现新的再记录过来吧。

以后发现的:

表格相关标签进行了优了,如<table><tr><td>等。

相关推荐
软件技术NINI32 分钟前
MATLAB疑难诊疗:从调试到优化的全攻略
javascript·css·python·html
苏打水com1 小时前
从 HTML/CSS/JS 到 React:前端进阶的平滑过渡指南
前端·javascript·html
~无忧花开~2 小时前
CSS学习笔记(五):CSS媒体查询入门指南
开发语言·前端·css·学习·媒体
嬉皮客3 小时前
TailwindCSS 初探
前端·css
西西学代码5 小时前
Flutter---音效模式选择器
前端·html
键盘不能没有CV键11 小时前
【图片处理】✈️HTML转图片字体异常处理
前端·javascript·html
云知谷14 小时前
【HTML】网络数据是如何渲染成HTML网页页面显示的
开发语言·网络·计算机网络·html
昔人'14 小时前
css使用 :where() 来简化大型 CSS 选择器列表
前端·css
昔人'14 小时前
css `dorp-shadow`
前端·css
昔人'18 小时前
`tanslate=“no“`避免使用 HTML 中的翻译属性自动翻译品牌名称等
html