JavaEE学习日志(四十五): bootstrap，栅格系统

最新推荐文章于 2022-04-13 16:38:06 发布
最新推荐文章于 2022-04-13 16:38:06 发布
阅读量305 收藏
点赞数 1
分类专栏： JavaEE学习日志 前端 Java第三方库 文章标签： bootstrap javascript html css 栅栏系统
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Sakuraaaaaaa/article/details/104919399
版权

JavaEE学习日志持续更新----> 必看！JavaEE学习路线（文章总汇）

JavaEE学习日志（四十五）

bootstrap

bootstrap导入

在这里插入图片描述
去官网下载，第一个为开发用，第二个既可以开发又有源码。

下载完后导入到自己的web项目中
在这里插入图片描述

bootstrap基本模板

注意：将所有的互联网连接的bootstrap改为连接到自己的项目中bootstrap

<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <!--
    	content="IE=edge"
    	window10操作系统，IE11，edge浏览器
    	如果使用IE的话，优先使用edge内核解析
    -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--
    	name="viewport"可视化区域
    	content="width=device-width, initial-scale=1"
    		width=device-width：宽度=设备宽度
    		initial-scale=1：不缩放
    		
    -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>基本模板</title>

    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">

    
  </head>
  <body>
    <h1>你好，世界！</h1>

    <!--
    	引入一个js文件，是jQuery的js的框架
    -->
    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
  </body>
</html>

分析代码：

<meta http-equiv="X-UA-Compatible" content="IE=edge">

content=“IE=edge”
window10操作系统，IE11，edge浏览器
如果使用IE的话，优先使用edge内核解析

<meta name="viewport" content="width=device-width, initial-scale=1">

name="viewport" 可视化区域
width=device-width宽度=设备宽度
initial-scale=1不缩放

栅格系统

栅格系统：对页面中内容进行布局排版
注意：页面中的一行分成了12个列。12列固定不能修改

响应式：把设备的宽度划分出了4个等级
在这里插入图片描述
代码示例：中等屏幕；样式row 表示页面的一行

<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>基本模板</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    
		<style type="text/css">
			div{
				border: 1px red solid;
			}
		</style>
    
  </head>
  <body>
    <!--
    	栅格系统：对页面中内容进行布局排版
    		页面中的一行分成了12个列。12列固定不能修改
    		页面中的一行，比例可以自己定义，但必须保证12列
    		
    		响应式：把设备的宽度划分出了4个等级
    			大屏幕 		>=1200像素
    			中等屏幕	<1200像素  >=992
    			小屏幕		<992  >=768
    			超小屏幕	<768
    		
    		样式row 表示页面的一行
    		样式container
    				
    -->
    <div class="container">
    	<div class="row">
    	<!--分成12个列，中等屏幕，占比1：1-->
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
	    	<div class="col-md-1">col-1</div>
    	</div>
    </div>

    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
  </body>
</html>

在这里插入图片描述

栅格系统小屏幕

<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>基本模板</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    
		<style type="text/css">
			div{
				border: 1px red solid;
			}
		</style>
    
  </head>
  <body>
    
    <div class="container">
    	<div class="row">
    	<!--分成12个列，无论屏幕，占比1：1-->
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	<div class="col-md-1 col-sm-1">col-1</div>
	    	
    	</div>
    	
    	<div class="row">
    	<!--
    		分成12个列，中等屏幕5，5，2
    		小屏幕占比8,2,2 col-sm
    	-->
	    	<div class="col-md-5 col-sm-8">col-1</div>
	    	<div class="col-md-5 col-sm-2">col-1</div>
	    	<div class="col-md-2 col-sm-2">col-1</div>
	    
    	</div>
    </div>
    
    	

    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
  </body>
</html>

栅格系统超小屏幕

<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>基本模板</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    
		<style type="text/css">
			div{
				border: 1px red solid;
			}
		</style>
    
  </head>
  <body>
    
    <div class="container">
    	<div class="row">
    	<!--分成12个列，无论屏幕，占比1：1-->
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	<div class="col-md-1 col-sm-1 col-xs-1">col-1</div>
	    	
    	</div>
    	
    	<div class="row">
    	<!--
    		分成12个列，中等屏幕5，5，2
    		小屏幕占比8,2,2 col-sm
    		超小屏幕占比1,3,8
    	-->
	    	<div class="col-md-5 col-sm-8 col-xs-1">col-1</div>
	    	<div class="col-md-5 col-sm-2 col-xs-3">col-1</div>
	    	<div class="col-md-2 col-sm-2 col-xs-8">col-1</div>
	    
    	</div>
    </div>
    
    	

    <script type="text/javascript" src="js/jquery-1.12.4.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
  </body>
</html>

栅格系统隐藏

在这里插入图片描述
代码示例：隐藏超小屏幕。
注意：隐藏后，其他标签需要凑足12份

...同上
<div class="col-md-5 col-sm-8 col-xs-4">col-1</div>
<div class="col-md-5 col-sm-2 hidden-xs">哈哈</div>
<div class="col-md-2 col-sm-2 col-xs-8">col-1</div>
...

全局CSS

复制粘贴即可

组件

复制粘贴即可，记录几个常用的

图标
在这里插入图片描述

<span class="glyphicon glyphicon-search" aria-hidden="true"></span>

下拉菜单
在这里插入图片描述

<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
    <li><a href="#">Action</a></li>
    <li><a href="#">Another action</a></li>
    <li><a href="#">Something else here</a></li>
    <li role="separator" class="divider"></li>
    <li><a href="#">Separated link</a></li>
  </ul>
</div>

分页
在这里插入图片描述

<nav aria-label="Page navigation">
  <ul class="pagination">
    <li>
      <a href="#" aria-label="Previous">
        <span aria-hidden="true">&laquo;</span>
      </a>
    </li>
    <li><a href="#">1</a></li>
    <li><a href="#">2</a></li>
    <li><a href="#">3</a></li>
    <li><a href="#">4</a></li>
    <li><a href="#">5</a></li>
    <li>
      <a href="#" aria-label="Next">
        <span aria-hidden="true">&raquo;</span>
      </a>
    </li>
  </ul>
</nav>

导航条
在这里插入图片描述

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Brand</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
        <li><a href="#">Link</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">Separated link</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">One more separated link</a></li>
          </ul>
        </li>
      </ul>
      <form class="navbar-form navbar-left">
        <div class="form-group">
          <input type="text" class="form-control" placeholder="Search">
        </div>
        <button type="submit" class="btn btn-default">Submit</button>
      </form>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">Link</a></li>
        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a>
          <ul class="dropdown-menu">
            <li><a href="#">Action</a></li>
            <li><a href="#">Another action</a></li>
            <li><a href="#">Something else here</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">Separated link</a></li>
          </ul>
        </li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>

反色的导航条
在这里插入图片描述

<nav class="navbar navbar-inverse">
  ...
</nav>

进度条
在这里插入图片描述

<div class="progress">
  <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
    <span class="sr-only">40% Complete (success)</span>
  </div>
</div>
<div class="progress">
  <div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
    <span class="sr-only">20% Complete</span>
  </div>
</div>
<div class="progress">
  <div class="progress-bar progress-bar-warning progress-bar-striped" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
    <span class="sr-only">60% Complete (warning)</span>
  </div>
</div>
<div class="progress">
  <div class="progress-bar progress-bar-danger progress-bar-striped" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
    <span class="sr-only">80% Complete (danger)</span>
  </div>
</div>

让进度条动起来：使用js
用一个进度条示例

<div class="progress">
  <div id="abc" class="progress-bar progress-bar-danger progress-bar-striped" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
    <span class="sr-only">80% Complete (danger)</span>
  </div>
</div>

	<script>
		var i = 0;
		var id = setInterval(function(){
			var abc = document.getElementById("abc");
			i++;
			abc.style.width=i+"%";
			abc.innerHTML=i+"%";
			if(i>99){
				clearInterval(id);
			}
		},200);
	</script>

JavaScript插件

模态框
在这里插入图片描述

<!-- Button trigger modal -->
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Modal title</h4>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

轮播图
在这里插入图片描述

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
  <!-- Indicators -->
  <ol class="carousel-indicators">
    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
    <li data-target="#carousel-example-generic" data-slide-to="2"></li>
  </ol>

  <!-- Wrapper for slides -->
  <div class="carousel-inner" role="listbox">
    <div class="item active">
      <img src="..." alt="...">
      <div class="carousel-caption">
        ...
      </div>
    </div>
    <div class="item">
      <img src="..." alt="...">
      <div class="carousel-caption">
        ...
      </div>
    </div>
    ...
  </div>

  <!-- Controls -->
  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </a>
  <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </a>
</div>

更多好玩的可以自己去挖掘！

隔叶听风
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
BootStrap4：栅格系统
分享日常工作技术
03-28 734
可以通过添加一个新的 .row 元素和一系列 .col-sm-* 元素到已经存在的 .col-sm-* 元素内。Bootstrap4 总共有五个栅格等级，每个响应式分界点隔出一个等级。使用响应式的.offset-*栅格偏移方法。
JavaWeb---Day 08
qq_49544301的博客
05-08 137
来华清JavaWeb学习的第八天
Bootstrap使用指南【JAVAEE基础】
liudachu的博客
06-06 348
Bootstrap 1.概念：一个前端开发的框架 * 框架：一个半成品软件，开发人员可以在框架基础上，再进行开发，简化编码 * 好处： 1.定义了很多的css样式和js插件。可以直接使用这些样式和插件得到丰富的页面效果。 2.响应式布局 * 同一套页面可以兼容不同分辨率的设备。 2.快速入门： 1.下载Bootstrap 2.将css、js、font文件夹复制到项目中 3.创建html页面，引入必要的文件 模版… 响应式布局(栅格系统) 同一套页面可以兼容不同分辨率的设备。 实现：依赖于栅格系统：将一行平
【JAVAEE基础学习（2）】--简述JavaScript&Bootstrap篇
lixxkv的博客
04-13 731
【JAVAEE基础学习（2）】--简述JavaScript&Bootstrap篇
简单栅格主题CSS模板
12-01
简单栅格主题CSS网页模板 灰色 商务 网页 模板 简单 商业 公司 设计 主页 HTML DIV+CSS 模板下载
基于JavaEE和Bootstrap的宿舍管理系统设计源码
最新发布
04-18
本项目是基于JavaEE和Bootstrap的宿舍管理系统设计源码，包含126个文件，其中主要包含41个java源代码文件，16个png图片文件，9个css样式文件等。系统采用了JavaEE和Bootstrap框架，实现了宿舍管理的功能，包括宿舍...
JavaEE学习日志(三十九): HTML表单，CSS引入方式
01-08
JavaEE学习日志持续更新—-> 必看！JavaEE学习路线（文章总汇） Java学习日志（三十九）HTML标签表单标签输入标签下拉菜单和多行文本GET和POSTdiv标签和span标签CSSCSS的作用和语法CSS的引入方式CSS的引入方式一：...
JavaEE课程设计：票据管理系统源码.zip
05-04
JavaEE课程设计：票据管理系统源码 JavaEE课程设计：票据管理系统源码 JavaEE课程设计：票据管理系统源码 JavaEE课程设计：票据管理系统源码 JavaEE课程设计：票据管理系统源码 JavaEE课程设计：票据管理系统...
Demo1_JAVAEE企业系统_后台管理系统_bootstrap_
09-29
连接MYSQL等数据库，使用bootstrap框架实现增删改查多种功能的后台管理员工系统，
javaee-bootstrap-skeleton:使用 Bootstrap 的 Java EE 骨架应用程序
06-02
javaee-bootstrap-骨架 使用Java EE 骨架应用程序
分布式java shiro、maven、Bootstrap、SpringMVC
mkoijlpo231的博客
03-11 535
​ 获取【下载地址】   QQ: 313596790   【免费支持更新】 支持三大数据库 mysql  oracle  sqlsever   更专业、更强悍、适合不同用户群体 【新录针对本系统的视频教程，手把手教开发一个模块，快速掌握本系统】 A 代码生成器(开发利器);       增删改查的处理类，service层，mybatis的xml，SQL( mysql   和oracl
JavaEE学习日记_BootStrap
buglei123的博客
08-10 216
layout: post title: JavaEE学习日记_BootStrap subtitle: BootStrap date: 2018-01-23 author: ZL header-img: img/20180123.jpg catalog: true tags: - BootStrap - JavaEE BootSt...
Java基础之bootstrap概述篇
weixin_42078450的博客
01-20 2396
1、bootstrap介绍      *Bootstrap，基于HTML、CSS、JavaScript的前端框架（半成品）。其预定义一套css样式和与此样式对应的jQuery代码，我们只需要提供固定的HTML结构，添加固定的css样式，就可以完成指定效果的实现。      *Bootstrap在jQuery的基础上工作，可以理解Bootstrap就是jQuery的一个插件。      *Bo...
01.Bootstrap入门、CSS样式【栅格系统】
weixin_62356088的博客
04-12 722
目录 1. WWW：What、Why、Where 2 1. 响应式设计(Bootstrap的响应式CSS能够自适应台式机、平板电脑和手机) 2 2. 移动设备有限 2 3. 浏览器支持 2 4. 容易上手 2 1. 企业网站、博客、网站后台之类的网站 2 2. 注意：非电商(电商网站分类很多) 2 2. 环境安装 2 3. Bootstrap CSS 3 3.1. 概览 3 3.1.1. H5文档类型 3 3.1.2. 移动设备优先 3 3.1.3. 布局容器 3 3.2. 栅.
java web-3.2Bootstrap_栅格系统
weixin_39795049的博客
03-06 291
栅格系统-入门 1.响应式布局：同一套页面可以兼容不同分辨率的设备 2.实现：依赖于栅格系统（栅格系统：将一行平均分为12个格子，可以指定元素占几个格子） 3.步骤： 定义容器。相当于之前的table 容器分类： container 和container-fluid 定义行。相当于之前的tr 样式：row 定义元素。指定该元素在不同的设备上，所占的格子数目。样式：col-设备代号...
JavaWeb——一文快速入门BootStrap（栅格系统、全局CSS样式、组件、插件、基于BootStrap的官网案例实战）
数字世界 万物互联
05-25 776
1、BootStrap概述 BootStrap是一个前端开发的框架，Bootstrap是美国Twitter公司的设计师Mark Otto和Jacob Thornton合作基于HTML、CSS、JavaScript开发的简洁、直观、强悍的前端开发框架，使得 Web 开发更加快捷。 所谓的框架，是一个半成品软件。利用Web开发的基础知识，我们也可以做出丰富的网站B/S架构程序，但是仅利用基础知识做的话，工作量会很大。所以，慢慢的就有人利用基础知识封装下，提供了jar包，我们借助其可以快速进行开发，这...
JavaEE中级.20190601.Bootstrap（Bootstrap介绍.Bootstrap 特点.下载与使用.布局容器.栅格网格系统.排版）
LiangEdward的博客
06-01 406
一.Bootstrap介绍 1.官网：http://getbootstrap.com/ 中文网：http://www.bootcss.com/ Bootstrap是一套现成的CSS样式集合（做得还是很友好的）。是两个推特的员工干出来的。。。 二、Bootstrap 特点 1.简洁、直观、强悍的前端开发框架，html、css、j...
JavaEE知识篇(8-25)——bootStrap
渐醒的思考者
04-05 289
本文旨在记录学习bootStrap响应式效果，具体开发时需要更具bootStrap开发手册。 文章目录1.BootStrap简介（WEB前端CSS框架）2. 环境的搭建：3. 实现商城首页的预备知识：4. 实现商城首页代码： 1.BootStrap简介（WEB前端CSS框架） Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快捷 ...
javaee学习笔记
08-31
JavaEE学习笔记是我自己在学习过程中总结的javaweb各项技术和知识点。它包含了JavaEE的十三种核心技术，分别是JDBC、JNDI、EJB、RMI、Servlet、JSP、XML、JMS、Java IDL、JTS、JTA、JavaMail和JAF。 JavaEE是一个开放的标准的组件体系结构，它独立于平台，但使用Java语言。一个JavaBean是一个满足JavaBeans规范的Java类，通常定义了一个现实世界的事物或概念。一个JavaBean的主要特征包括属性、方法和事件。 在支持JavaBeans规范的开发环境中，可以可视地操作JavaBean，也可以使用JavaBean构造出新的JavaBean。JavaBean的优势还在于Java带来的可移植性。所以在JavaEE学习笔记中，你可以找到关于这些核心技术和JavaBean的详细内容和示例。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [javaEE学习笔记](https://download.csdn.net/download/sugar_map/10268742)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* *3* [JavaEE学习笔记整理](https://blog.csdn.net/qq_51861704/article/details/124133294)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值