编程笔记 html5&css&js 095 JavaScript 第三方库或框架
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>第三方库或框架示例</title>
<!-- 引入jQuery -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!-- 引入Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<!-- 引入Bootstrap JS -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<style>
/* 自定义样式 */
.btn-primary {
background-color: #f44336; /* 红色 */
border-color: #d3d3d3;
}
</style>
</head>
<body>
<button class="btn btn-primary">点击我</button>
<script>
// jQuery 示例
$(document).ready(function(){
$(".btn-primary").click(function(){
alert('按钮被点击');
});
});
</script>
</body>
</html>
这个代码示例展示了如何在HTML文件中引入jQuery库、Bootstrap CSS和JavaScript库,并添加了一个按钮,当被点击时会弹出警告框。这是一个简单的实践,演示了如何利用第三方库和框架来增强网页的功能和美观。
评论已关闭