3.22-3.28 强奔

最新推荐文章于 2024-05-23 17:56:03 发布

qq_42435952

最新推荐文章于 2024-05-23 17:56:03 发布

阅读量65

点赞数

文章标签： css java

本文链接：https://blog.csdn.net/qq_42435952/article/details/115064551

版权

CSS学习笔记

CSS列表

主要属性:
list-style-type 设置列表标记类型，比如圆圈，方块，数字
list-style-position 标记图像的设置位置
list-style-image 设置标记图像样式
列表的属性作用：
设置列表项标记为有序列表
设置列表项标记为无序列表
设置列表项标记为图像
列表类型：
无序列表（ul）
有序列表（ol）

<style>
ul.a {
	list-style-type:circle;
	
}/*无序小圆点*/
ul.b {list-style-type:square;}/* 无序小方块*/
ol.c {list-style-type:upper-roman;}/*大写罗马计数*/
ol.d {list-style-type:lower-alpha;}/*小写字母*/
</style>
</head>

<body>
<p>无序列表实例:</p>

<ul class="a">
  <li>Coffee</li> <!--list专用的HTML-->
  <li>Tea</li>
  <li>Coca Cola</li>
</ul>

<ul class="b">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Coca Cola</li>
</ul>

<p>有序列表实例:</p>

<ol class="c">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Coca Cola</li>
</ol>

<ol class="d">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Coca Cola</li>
</ol>

ul
{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}
ul li
{
    background-image: url(sqpurple.gif);
    background-repeat: no-repeat;
    background-position: 0px 5px; 
    padding-left: 14px; 
}

CSS列表

边框：border
合成一个边框：为了显示一个表的单个边框，使用 border-collapse属性
宽度和高度：width和height定义了表格的宽度和高度。
对齐方式：text-align:right 右对齐
垂直对齐方式：vertical-align:bottom 顶部中间或者底部
表中空格边框：padding：15px
表中字的颜色：color：green
背景颜色：background-color：red

CSS盒子模型（Box Model）

在这里插入图片描述
不同部分的说明：

Margin(外边距) - 清除边框外的区域，外边距是透明的。
Border(边框) - 围绕在内边距和内容外的边框。
Padding(内边距) - 清除内容周围的区域，内边距是透明的。
Content(内容) - 盒子的内容，显示文本和图像。
为了正确设置元素在所有浏览器中的宽度和高度，需要知道的盒模型是如何工作的。

网页布局

网页布局有很多种方式，一般分为以下几个部分：头部区域、菜单导航区域、内容区域、底部区域。
在这里插入图片描述

博客登录页面开发问题

实例开发

在这里插入图片描述

根据菜鸟教程的CSS综合实例，理解了其中的代码实例，并修改了一些信息。博客首页的架构设计还不太完善。

springboot学习笔记

.xxAutoConfiguration 向容器中自动配置组件
.xxproperties ：自动配置类，装配配置文件中自定义一些内容

要解决的问题：
导入静态资源
jsp，模板引擎Thymeleaf
装配扩展SpringMVC
增删改查
拦截器
国际化

http://localhost:8080/

静态资源

拿到web静态资源的方式（若自定义后静态资源包就失效了）
1、webjars（不建议使用）
2、resources下的resources，static，public优先级依次向下

模板引擎

Thymeleaf是⾯向Web和独⽴环境的现代服务器端Java模板引擎，能够处理HTML，XML，JavaScript，CSS甚⾄纯⽂本。
只需要使用thymeleaf，只需要导入对应的依赖，版本得对应上
将html放到templates目录下即可

org.thymeleaf thymeleaf 3.0.0.RELEASE compile org.thymeleaf thymeleaf-spring4 3.0.0.RELEASE compile 导入thymeleaf依赖 org.thymeleaf thymeleaf-spring5 org.thymeleaf.extras thymeleaf-extras-java8time xmlns:th=“http://www.thymeleaf.org” ![在这里插入图片描述](https://img-blog.csdnimg.cn/20210326104142290.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQyNDM1OTUy,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/20210326104204609.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQyNDM1OTUy,size_16,color_FFFFFF,t_70)

问题：一直报错显示camn not resolve msg,又或者显示不出msg的内容，多次删除项目重建项目之后终于成功了。/为什么搭环境环境问题这么恶心淦/

先写conroller下的启动类然后再写templates下的html

首页和图标定制

index.html放到resources下作为首页，一般放到static下

遇到的问题

往pom文件导入依赖的时候找不到相应的依赖，自动导入框没有弹出来。在这里插入图片描述
解决办法：重新打开这个项目会发现相应文件正在下载。

vue学习笔记

qq_42435952

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
3.22-3.28 强奔

CSS学习笔记CSS列表主要属性:list-style-type 设置列表标记类型，比如圆圈，方块，数字list-style-position 标记图像的设置位置list-style-image 设置标记图像样式列表的属性作用：设置列表项标记为有序列表设置列表项标记为无序列表设置列表项标记为图像列表类型：无序列表（ul）有序列表（ol）<style>ul.a { list-style-type:circle; }/*无序小圆点*/ul.b {list-styl
复制链接

扫一扫