CSS 和 Bootstrap 的区别
级联样式表(CSS) : CSS 是由伯特·波斯哈肯·威姆开发的,万维网 1996 年 12 月 17 日。它是一种用于描述 HTML 元素如何在网页或 HTML 文档布局上显示的语言,如字体、颜色、边距、填充、高度、宽度、背景图像等。CSS 代表层叠样式表,这里层叠是指我们应用样式过程的部分,样式是指颜色、边距、表格段落的字体和标题等。工作表是指网页的外观。在 CSS 中,我们可以通过编辑单个 CSS 文件来改变网页的外观和布局。
CSS 有三种类型。
- 内嵌 CSS
- 内部 CSS
- 外部 CSS
示例:这个示例描述了简单 CSS 属性的使用。
<!DOCTYPE html>
<html>
<head>
<style>
p {
color: red;
text-align: center;
}
</style>
</head>
<body>
<p>Geeksforgeeks</p>
<p>
A Computer Science
portal for Geeks
</p>
</body>
</html>
输出:
Bootstrap:Bootstrap 是目前最流行的开源前端框架。它是由马克·奥托、雅各布·桑顿于 2011 年 8 月 19 日开发的。Bootstrap 是 CSS 类和 JavaScript 函数的集合,用于响应性设计和构建响应性、移动优先的站点和应用程序。它通常在网格系统上工作,在行和列的帮助下创建页面布局,并且它支持创建响应性网站的所有浏览器。
示例:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Color Example</title>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width,
initial-scale=1">
<link rel="stylesheet" href=
"https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js">
</script>
<script src=
"https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js">
</script>
</head>
<body>
<div class="container">
<h2>Bootstrap Colors List</h2>
<ul>
<li class="text-muted">GeeksforGeeks</li>
<li class="text-primary">GeeksforGeeks</li>
<li class="text-success">GeeksforGeeks</li>
<li class="text-info">GeeksforGeeks</li>
<li class="text-warning">GeeksforGeeks class</li>
<li class="text-danger">GeeksforGeeks</li>
<li class="text-secondary">GeeksforGeeks</li>
<li class="text-white">GeeksforGeeks</li>
<li class="text-dark">GeeksforGeeks</li>
</ul>
</div>
</body>
</html>
输出:
CSS 和 Bootstrap 的区别:
| 级联样式表 | 引导程序 | | CSS 是由伯特·波斯哈肯·维姆·莱于 1996 年 12 月 17 日在万维网上开发的。 | 自举由马克·奥托开发,雅各布·桑顿 2011 年 8 月 19 日。 | | CSS 代表内容的样式和外观,如字体、颜色、边距、填充等。 | Bootstrap 是一个免费的开源 CSS 框架,用于开发响应性网站。 | | CSS 没有网格系统。 | Bootstrap 基于网格系统。 | | 它目前正在开发最新版本的 CSS3。 | Bootstrap 目前正在运行 Bootstrap 4,这是 Bootstrap 的最新版本。 | | CSS 不提供响应页面或网站。 | 在 Bootstrap 中,我们可以设计一个有响应的网站或网页。 | | CSS 比 Bootstrap 更复杂,因为没有预定义的类和设计。 | Bootstrap 很容易理解,它有很多预设计类。 | | 在 CSS 中,我们必须从头开始编写代码。 | 在 Bootstrap 中,我们可以在代码中添加预定义的类,而无需编写代码。 |
版权属于:月萌API www.moonapi.com,转载请注明出处