ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

JavaWeb快速入门--Bootstrap

2021-11-20 13:33:06  阅读:110  来源: 互联网

标签:JavaWeb -- Bootstrap 样式 Link class CSS


上一篇:JavaWeb学习总结04–JS(2)

下一篇:JavaWeb学习总结06–XML

Bootstrap:


Bootstarp访问网址:https://v3.bootcss.com/

在这里插入图片描述

Bootstrap: 一个前端开发的框架,Bootstrap,来自 Twitter,是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的,它简洁灵活,使得 Web 开发更加快捷。在其中,定义了很多的css样式和js插件。我们开发时可以直接可以使用这些样式和插件得到丰富的页面效果。

快速入门

1. 下载Bootstrap:https://v3.bootcss.com/

2. 在项目中导入资源

在这里插入图片描述

3. 创建html页面,引入必要的资源文件

Bootstrap HelloWorld

你好,世界!

全局CSS样式


在Bootstrap提供了许多可以控制CSS样式的方法,我们可以通过可以通过 class 设置样式,对相应的属性进行控制,使我们的Web界面更加丰富多彩。

在这里插入图片描述

CSS样式:

  • 按钮:class=“btn btn-default”

  • 图片:

  • class=“img-responsive”:图片在任意尺寸都占100%

  • 图片形状

  • ...:方形

  • ... : 圆形

  • ... :相框

  • 表格

  • ta

【一线大厂Java面试题解析+后端开发学习笔记+最新架构讲解视频+实战项目源码讲义】

浏览器打开:qq.cn.hn/FTf 开源分享

ble

  • table-bordered

  • table-hover

  • 表单

  • 给表单项添加:class=“form-control”

组件:

Toggle navigation

Brand

标签:JavaWeb,--,Bootstrap,样式,Link,class,CSS
来源: https://blog.csdn.net/m0_63174529/article/details/121438170

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有