背景

因为Spring Boot中的src或href都是使用th:src，th:href，这里是使用了模板引擎，而在CSS里面，貌似用不了th这语法，如下CSS

body {background: url(background.jpg);height: 100%;
}

这里该如何在Spring Boot中使用background呢，只要把这个放到css里！

再用html界面使用th，模板引擎进行加载！

如下所示！

演示

这里程序结构如下：

这里的my.css源码如下：


body {background: url(background.jpg);height: 100%;
}

这里在index.html下添加如下代码：

<link rel="stylesheet" type="text/css" href="#" th:href="@{/img/my.css}" />

通过这种方式可以为设置底纹：

如下，没有底纹的运行截图：

有底纹的运行截图：

前端笔记-使用CSS为前端界面设置背景底纹相关推荐

Henry前端笔记之 CSS相关
Henry前端笔记之 CSS相关深入理解vertical-align和line-height的基友关系深入理解vertical-align和line-height的基友关系详见:基友理解 px. ...
字节青训前端笔记 | 理解CSS
CSS 作为前端技术栈中关键一环,对页面元素及样式呈现起到了直接作用.本节课旨在通过对 CSS 的工作流程及原理.页面中 CSS 使用方法等详细解读,帮助前端新手建立对 CSS 的全面而深刻的认知. ...
前端笔记html+css+vue, 页面布局、定位、字体背景等和一些常用方法
目录弹性布局: 定位: overflow溢出: 表单: vue数据存取: vuex store 全局数据: vux弹窗,软提示,硬提示 ElementUI MessageBox 弹框简单用法背景设 ...
前端笔记(Html+CSS+JS+DOM+网页特效+jQuery+HTML5+CSS3+canvas 标签+web开发重难点+面向对象+AJAX)
第1章Html Html:超级文本标记语言(HyperText Markup Language),在浏览器上运行的一种标记语言. 就是给文本加上含有语义的标签. 接下来应该学习更多具体语义标签: 一. ...
(前端)HTML之CSS(选择器字体排版背景）
网页的三大基石 HTML:结构 CSS:美化 JavaScript:动态 1.认识CSS样式 CSS全称为"层叠样式表(Cascading Style Sheets)"主要 ...
[前端笔记006]CSS布局之字体 -- font
资源推荐zeal:离线文档查看器 https://zealdocs.org/ 推荐w3c:线上文档 https://www.w3school.com.cn/ 本笔记参考视频,尚硅谷:BV1XJ411 ...
前端笔记-webpack加载前端资源（图片，css等）
目录基本概念代码与实例基本概念通过在webpack.config.js这个文件中添加module rules进行如下代码: 这里分别是加载vue,以及css,和styl样式和图片 styl用于 ...
前端笔记之CSS基础 - 字体和文本样式
目录 1.字体样式 1.1.字体大小 1.2.字体粗细 1.3.文字样式(是否倾斜) 1.4.字体 1.5.层叠性 1.6.字体font相关属性的连写 2.文本样式 2.1.文本缩进 2.2.文本水平 ...
Java前端笔记-后端Springboot，前端vue，Nginx使前后端分离
目录基本概念代码实例基本概念这是一个很6的模式,以目前本人C++ Qt的技术,是做不出的,但Java已经有雏形了. 后端采用Spring Boot主要是回json数据,如下所示: 这里的数据都 ...

前端笔记-使用CSS为前端界面设置背景底纹

背景

演示

前端笔记-使用CSS为前端界面设置背景底纹相关推荐

最新文章

热门文章