【JSP教程】如何引用外部样式表

 时间:2024-10-14 20:25:18

1、新建一个名为"shi"的动态web项目,如下图所示。

【JSP教程】如何引用外部样式表

2、右击此项目中的WebContent目录,并依次选择【新建>文件夹】菜单项,在弹出的【新建文件夹】窗口中的【文件夹名】文本框中输入"CSS”,并单击【完成】按钮完成文件夹的创建,如下图所示。

【JSP教程】如何引用外部样式表【JSP教程】如何引用外部样式表【JSP教程】如何引用外部样式表

3、右击名为“CSS”的文件夹,在弹出的快捷菜单中执行【新建>其他】命令,如下图所示。

【JSP教程】如何引用外部样式表

4、在弹出的【新建】窗口中,选择Web目录下的CSS文件(CSS File),即创建CSS文件,单击【下一步】按钮,如下图所示。

【JSP教程】如何引用外部样式表

5、在弹出的【新建CSS文件】窗口中,更改文件名为“testcss.css”,单击【完成】按钮,如下图所示

【JSP教程】如何引用外部样式表【JSP教程】如何引用外部样式表

6、添加CSS代码,如下图所示。【解释说明】body:选择的装饰对象background-color属性:定义某元素的背景颜色

【JSP教程】如何引用外部样式表

7、切换到index.jsp,在<head>和</head>之间添加<link rel="styles茑霁酌绡heet" type="text/css" href="CSS/testcss.css">,如下图所示。【解释说明】CSS/testcss.css:CSS目录下名为“testcss”的CSS文件

【JSP教程】如何引用外部样式表

8、右击index.jsp页面文件,在弹出的快捷菜单中选择【运行方式>在服务器上运行】菜单项,如下图所示。

【JSP教程】如何引用外部样式表

9、在弹出的【保存资源】对话框中,单击【save(保存)】按钮,即将刚才更改的jsp文件和css文件保存下来,如下图所示。

【JSP教程】如何引用外部样式表

10、在弹出的【在服务器上运行】对话框中,直接单击【完成】按钮,如下图所示。

【JSP教程】如何引用外部样式表

11、运行完成后,可以看到页面的背景色已被修饰,如下图所示。

【JSP教程】如何引用外部样式表
  • 教你如何在白天拍摄人像剪影
  • dreamweaver 8加入div并设定宽高背景色方法
  • PS图层的显示和隐藏
  • 网站设计Dreamweaver8如何设计网页背景
  • FrontPage技巧:[15]如何在网页中制作表格框架
  • 热门搜索
    sea是什么意思 蒙蒙的什么 有什么花的名字 attention是什么意思 chick是什么意思 植树的好处是什么 station是什么意思 肚子发胀是什么原因 8月14日是什么节 氟利昂是什么