发表于： 2017-10-26 23:20:11
1 584
今天完成的事情
看了一点css的介绍
- CSS 指层叠样式表 (Cascading Style Sheets)，样式定义如何显示 HTML 元素，这样可以实现内容和表现的分离。
这是一种分层设计的思想，css把和颜色，大小位置等信息剥离，而html只用关心提供什么样的内容
为了实现如下的改变字体颜色的效果：
单纯用html的代码如下：
<p style="color:red">red</p>
<p style="color:blue">blue</p>
使用css方式时，建立css文件，将样式信息单独写入其中：
.p1{
color:red;
}
.p2{
color:blue;
}
html中的代码：
<link rel="stylesheet" type="text/css" href="style.css"/>
<p class=“p1”>red</p>
<p class="p2">blue</p>
只需要在前面加上：<link rel="stylesheet" type="text/css" href="style.css"/> ，就可以关联css文件中的信息，实现分离。
将静态页面加入web项目中，实现用tomcat访问
可以直接在之前的项目中加入页面文件具体如下：
image中是相关的图片，.css文件中是页面样式
直接把文件复制到webapp下，在springMVC的配置文件中需要加入以下语句：
<mvc:default-servlet-handler/>
不然是加载不了图片等静态资源的。
将css文件放置到新建的css文件夹中，方便管理。
资源的路径都是采用相对路径没有改动，直接将html文件的后缀改为.jsp，在前面添加语句：
<%@ page language="java" contentType="text/html; charset=UTF-8"%>
不然可能会有中文乱码
删除 <!DOCTYPE html>
启动tomcat，输入地址，执行结果：
成功显示
明天的计划
根据页面设计数据表，修改为动态页面
遇到的问题
之前将页面的相关文件放到了WEB-INF/jsp中，出现了只能加载jsp内容，无法加载图片和css的情况，然后将所有相关文件移动到webapp下就能正常显示了，可能是因为在WEB-INF下不能加载其他资源文件。
收获
对css有了一些了解。
返回列表
评论