精华内容
下载资源
问答
  • java web 插入图片 / 背景

    千次阅读 2020-11-19 18:02:59
    CSS设置 背景填充 自适应全屏 例: Insert title here Hello 若只是普通的插入图片: /image/cat1.jpg> 图片也可滚动 /image/cat1.jpg> 例一个动态壁纸 Starfield Welcome

    CSS设置
    背景填充
    自适应全屏
    例:在这里插入图片描述

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
    </head>
    
    <style type="text/css">		
     .p1{
    
                height:100%;
    
                width: 100%;
    
                position: fixed;
                
                background-position: center 0;
    
                background-image:url("image/cat1.jpg");
    
            }
    
    </style>
    
    <body>
     <p class="p1">Hello</p>
    </body>
    </html>
    

    在这里插入图片描述

    若只是普通的插入图片:
    <img id=“background” src=<%=request.getContextPath()%>/image/cat1.jpg>

    图片也可滚动

    <marquee behavior="scroll" direction="up" height="300" style="overflow:hidden;" scrollamount="5" width="300" onMouseOver="stop()" onMouseOut="start()">
    		
    	<img  src=<%=request.getContextPath()%>/image/cat1.jpg>
    	</marquee>
    

    例一个动态壁纸

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <!-- saved from url=(0037)http://html5wallpaper.com/wp-depo/15/ -->
    <html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    	<title>Starfield</title>
    	
    	<meta http-equiv="content-language" content="en">
    	<meta name="description" content="javascript+canvas starfield">
    	<meta name="keywords" content="starfield, star,3d,effect,visual,javascript,canvas,dhtml,webdesign,google,chrome">
    	<meta name="author" content="REZ">
    	<meta name="generator" content="REZ">
    	<meta name="version" content="2.1">
    	<meta name="copyright" content="REZ 2007-2009">
    	<meta name="robots" content="all">
    	<meta name="viewport" content="width=device-width,user-scalable=0,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0">
    	<style type="text/css">
    	body  {margin:0;padding:0;background-color:#000000;font-size:0;overflow:hidden}
    	div   {margin:0;padding:0;position:absolute;font-size:0;overflow:hidden}
    	canvas{background-color:#000000;overflow:hidden}
    	</style>
    <script type="text/javascript">
    google_ad_client='pub-5142607733332317';
    google_ad_slot='6304267293';
    google_ad_width=728;
    google_ad_height=15;
    </script><script type="text/javascript">
    function $i(id) { return document.getElementById(id); }
    function $r(parent,child) { (document.getElementById(parent)).removeChild(document.getElementById(child)); }
    function $t(name) { return document.getElementsByTagName(name); }
    function $c(code) { return String.fromCharCode(code); }
    function $h(value) { return ('0'+Math.max(0,Math.min(255,Math.round(value))).toString(16)).slice(-2); }
    function _i(id,value) { $t('div')[id].innerHTML+=value; }
    function _h(value) { return !hires?value:Math.round(value/2); }
    
    function get_screen_size()
    	{
    	var w=document.documentElement.clientWidth;
    	var h=document.documentElement.clientHeight;
    	return Array(w,h);
    	}
    
    var url=document.location.href;
    
    var flag=true;
    var test=true;
    var n=parseInt((url.indexOf('n=')!=-1)?url.substring(url.indexOf('n=')+2,((url.substring(url.indexOf('n=')+2,url.length)).indexOf('&')!=-1)?url.indexOf('n=')+2+(url.substring(url.indexOf('n=')+2,url.length)).indexOf('&'):url.length):512);
    var w=0;
    var h=0;
    var x=0;
    var y=0;
    var z=0;
    var star_color_ratio=0;
    var star_x_save,star_y_save;
    var star_ratio=256;
    var star_speed=4;
    var star_speed_save=0;
    var star=new Array(n);
    var color;
    var opacity=0.1;
    
    var cursor_x=0;
    var cursor_y=0;
    var mouse_x=0;
    var mouse_y=0;
    
    var canvas_x=0;
    var canvas_y=0;
    var canvas_w=0;
    var canvas_h=0;
    var context;
    
    var key;
    var ctrl;
    
    var timeout;
    var fps=0;
    
    function init()
    	{
    	var a=0;
    	for(var i=0;i<n;i++)
    		{
    		star[i]=new Array(5);
    		star[i][0]=Math.random()*w*2-x*2;
    		star[i][1]=Math.random()*h*2-y*2;
    		star[i][2]=Math.round(Math.random()*z);
    		star[i][3]=0;
    		star[i][4]=0;
    		}
    	var starfield=$i('starfield');
    	starfield.style.position='absolute';
    	starfield.width=w;
    	starfield.height=h;
    	context=starfield.getContext('2d');
    	//context.lineCap='round';
    	context.fillStyle='rgb(0,0,0)';
    	context.strokeStyle='rgb(255,255,255)';
    	var adsense=$i('adsense');
    	adsense.style.left=Math.round((w-728)/2)+'px';
    	adsense.style.top=(h-15)+'px';
    	adsense.style.width=728+'px';
    	adsense.style.height=15+'px';
    	adsense.style.display='block';
    	}
    
    function anim()
    	{
    	mouse_x=cursor_x-x;
    	mouse_y=cursor_y-y;
    	context.fillRect(0,0,w,h);
    	for(var i=0;i<n;i++)
    		{
    		test=true;
    		star_x_save=star[i][3];
    		star_y_save=star[i][4];
    		star[i][0]+=mouse_x>>4; if(star[i][0]>x<<1) { star[i][0]-=w<<1; test=false; } if(star[i][0]<-x<<1) { star[i][0]+=w<<1; test=false; }
    		star[i][1]+=mouse_y>>4; if(star[i][1]>y<<1) { star[i][1]-=h<<1; test=false; } if(star[i][1]<-y<<1) { star[i][1]+=h<<1; test=false; }
    		star[i][2]-=star_speed; if(star[i][2]>z) { star[i][2]-=z; test=false; } if(star[i][2]<0) { star[i][2]+=z; test=false; }
    		star[i][3]=x+(star[i][0]/star[i][2])*star_ratio;
    		star[i][4]=y+(star[i][1]/star[i][2])*star_ratio;
    		if(star_x_save>0&&star_x_save<w&&star_y_save>0&&star_y_save<h&&test)
    			{
    			context.lineWidth=(1-star_color_ratio*star[i][2])*2;
    			context.beginPath();
    			context.moveTo(star_x_save,star_y_save);
    			context.lineTo(star[i][3],star[i][4]);
    			context.stroke();
    			context.closePath();
    			}
    		}
    	timeout=setTimeout('anim()',fps);
    	}
    
    function move(evt)
    	{
    	evt=evt||event;
    	cursor_x=evt.pageX-canvas_x;
    	cursor_y=evt.pageY-canvas_y;
    	}
    
    function key_manager(evt)
    	{
    	evt=evt||event;
    	key=evt.which||evt.keyCode;
    	//ctrl=evt.ctrlKey;
    	switch(key)
    		{
    		case 27:
    			flag=flag?false:true;
    			if(flag)
    				{
    				timeout=setTimeout('anim()',fps);
    				}
    			else
    				{
    				clearTimeout(timeout);
    				}
    			break;
    		case 32:
    			star_speed_save=(star_speed!=0)?star_speed:star_speed_save;
    			star_speed=(star_speed!=0)?0:star_speed_save;
    			break;
    		case 13:
    			context.fillStyle='rgba(0,0,0,'+opacity+')';
    			break;
    		}
    	top.status='key='+((key<100)?'0':'')+((key<10)?'0':'')+key;
    	}
    
    function release()
    	{
    	switch(key)
    		{
    		case 13:
    			context.fillStyle='rgb(0,0,0)';
    			break;
    		}
    	}
    
    function mouse_wheel(evt)
    	{
    	evt=evt||event;
    	var delta=0;
    	if(evt.wheelDelta)
    		{
    		delta=evt.wheelDelta/120;
    		}
    	else if(evt.detail)
    		{
    		delta=-evt.detail/3;
    		}
    	star_speed+=(delta>=0)?-0.2:0.2;
    	if(evt.preventDefault) evt.preventDefault();
    	}
    
    function start()
    	{
    	resize();
    	anim();
    	}
    
    function resize()
    	{
    	w=parseInt((url.indexOf('w=')!=-1)?url.substring(url.indexOf('w=')+2,((url.substring(url.indexOf('w=')+2,url.length)).indexOf('&')!=-1)?url.indexOf('w=')+2+(url.substring(url.indexOf('w=')+2,url.length)).indexOf('&'):url.length):get_screen_size()[0]);
    	h=parseInt((url.indexOf('h=')!=-1)?url.substring(url.indexOf('h=')+2,((url.substring(url.indexOf('h=')+2,url.length)).indexOf('&')!=-1)?url.indexOf('h=')+2+(url.substring(url.indexOf('h=')+2,url.length)).indexOf('&'):url.length):get_screen_size()[1]);
    	x=Math.round(w/2);
    	y=Math.round(h/2);
    	z=(w+h)/2;
    	star_color_ratio=1/z;
    	cursor_x=x;
    	cursor_y=y;
    	init();
    	}
    
    document.onmousemove=move;
    document.onkeypress=key_manager;
    document.onkeyup=release;
    document.onmousewheel=mouse_wheel; if(window.addEventListener) window.addEventListener('DOMMouseScroll',mouse_wheel,false);
    
    </script><style type="text/css">
    :root #adsense
    { display: none !important; }
    :root *[quqqn1e][hidden] { display: none !important; }</style></head>
    
    
    
    
    <body onload="start()" onresize="resize()" onorientationchange="resize()" onmousedown="context.fillStyle=&#39;rgba(0,0,0,&#39;+opacity+&#39;)&#39;" onmouseup="context.fillStyle=&#39;rgb(0,0,0)&#39;">
    <canvas id="starfield" style="background-color: rgb(0, 0, 0); position: absolute;" width="1010" height="362"></canvas>
    <div id="adsense" style="position: absolute; background-color: transparent; left: 141px; top: 347px; width: 728px; height: 15px; display: block;" quqqn1e="" hidden="">
    	<script type="text/javascript" src="http://html5wallpaper.com/wp-depo/15/Starfield_files/show_ads.js"></script>
    </div>
    
    <h1 align="center" id="character1">Welcome</h1>
    
    <script type="text/javascript" src="http://html5wallpaper.com/wp-depo/15/Starfield_files/urchin.js"></script>
    <script type="text/javascript"> var _uacct='UA-241365-1'; urchinTracker(); </script>
    
    <style>#adsense
    {display:none !important;}</style>
    
    <script type="text/javascript" language="javascript">
             
        var i=0;
        setInterval('changeColor()',500);
            function changeColor(){
                var div1=document.getElementById('character1'); 
              
                var colorArr1=['#8A2BE2','#DEB887','#7FFF00','#008B8B','#FF1493','#DA70D6','#B0C4DE']; 
               
                if(i==colorArr1.length){ 
                        i=0;
                    }else{
                        div1.style.color=colorArr1[i++%colorArr1.length]; 
                       
                    }
                }
            
            
            </script>
            </body></html>
    

    在这里插入图片描述

    展开全文
  • java web项目中如何插入背景图片

    万次阅读 2018-11-12 20:12:59
    对于java可视化界面插入背景图片这个倒是轻而易举,只需要background-inage:url(图片路径就行),而对于与web项目中,我开始时也是采用这种方法,但是不尽然,代码如下: &lt;div class='ban' style="...

          对于java可视化界面插入背景图片这个倒是轻而易举,只需要background-inage:url(图片路径就行),而对于与web项目中,我开始时也是采用这种方法,但是不尽然,代码如下:

    <div class='ban' style="height:100%;background-image:url('/img/qx.jpg')">

    效果如下:

    图片就是不显示,后期我又加了<img alt="" src="/img/qx.jpg">,效果还是和上面一样,也是没有图片显示。后来我仔细想了想,是没有获取到图片真正的路径问题。我们需要获取/img/qx.jpg,

    我们就需要在jsp页面中写Java代码,让Java来获取项目的根路径,通过绝对路径的方式引入这些图片文件。我们则需要在jsp文件的开头写入下面的代码。

    <%
    String path = request.getContextPath();
    String basePath=null;
    basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
    int port=request.getServerPort();
    	
    	if(port==80){
    	basePath=request.getScheme()+"://"+request.getServerName()+path;
    	
    	}else{
    		basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
    		
    	}
    	request.setAttribute("basePath", basePath);
    %>

    这几段代码只是获取基本的路径,而request就是我们常说的JSP九大隐式对象之一,JSP就是Servlet,request.setAttribute("basePath", basePath) 表示将得到的basePath(项目根路径)存放到request作用域中,但是到这里我们还是不能把图片显示出来,我们需要在图片路径前面加入这行代码$<basePath>。如下:

    <div class='ban' style="height:100%;background-image:url('${basePath}/img/qx.jpg')">

    看,图片就显示出来了:

    好了,这次就分享到这里了,这里只是一个简单的图片插入问题,若有什么不对的地方,还望指教。

    展开全文
  • 借鉴了这位博主实现了一个好看的登录界面,但是遇到了图片不显示的问题 ...depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogComm

    借鉴了这位博主实现了一个好看的登录界面,但是遇到了图片不显示的问题
    https://blog.csdn.net/Wrj6811/article/details/105800712?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.channel_param
    引用后无法显示背景图片。最后通过查阅资料
    做了很多改正,不知道是哪个起了作用

    文件结构如下图
    我的项目部分文件结构更改如下:
    1.配置web.xml文件,加入如下代码

    <servlet-mapping>
      <servlet-name>default</servlet-name>
      <url-pattern>*.css</url-pattern>
     </servlet-mapping>
     <servlet-mapping>
      <servlet-name>default</servlet-name>
      <url-pattern>*.js</url-pattern>
     </servlet-mapping>
     <servlet-mapping>
      <servlet-name>default</servlet-name>
      <url-pattern>*.ico</url-pattern>
     </servlet-mapping>
     <servlet-mapping>
      <servlet-name>default</servlet-name>
      <url-pattern>*.jpg</url-pattern>
     </servlet-mapping>
     <servlet-mapping>
      <servlet-name>default</servlet-name>
      <url-pattern>*.png</url-pattern>
     </servlet-mapping>
     <servlet-mapping>
      <servlet-name>default</servlet-name>
      <url-pattern>*.gif</url-pattern>
     </servlet-mapping>

    2.去掉了原文中的单引号,加上了 . ./
    其中./代表当前文件所在目录的上一级目录
    . ./代表当前文件所在目录

    background: url(../img/city.png) no-repeat;

    然后再运行就可以显示背景图片了。大致效果如图:
    在这里插入图片描述

    展开全文
  • JAVA之设置背景图片的几种方法

    万次阅读 多人点赞 2015-05-17 13:28:01
    创建一个ImageIcon对象,来获取背景图片。 ImageIcon img = new ImageIcon("image/img1.png"); 创建一个JLabel对象,将图片img载入到JLabel对象中。 JLabel jl_bg = new JLabel(img); //背景 然后,设置jl_bg的...
    

    第一种方法,通过JLabel来装载图片。

    创建一个ImageIcon对象,来获取背景图片。

    ImageIcon img = new ImageIcon("image/img1.png");

    创建一个JLabel对象,将图片img载入到JLabel对象中。

    JLabel jl_bg = new JLabel(img); //背景

    然后,设置jl_bg的位置和大小。

    this.jl_bg.setBounds(0, 0, 600, 400); //设置位置和大小,先setLayout(null)一下。

    将JLabel对象jl_bg放入分层面板中。

    this.getLayeredPane().add(jl_bg, new Integer(Integer.MIN_VALUE));
    ((JPanel)this.getContentPane()).setOpaque(false); //设置透明
    

    如上代码中,getLayeredPane()获取的是分层面板,将背景图片放置最底层,就可以作为背景图片了。我们知道,在JFrame中还有一个ContentPane容器,如此,放置最底层就会被ContentPane所遮挡,所以,需要添加第二行代码,将此设置为透明。注意,需要对其进行强制转换。


    第二种方法,通过paint绘制背景图片。

    这种方法也是比较常用的方法,首先需要创建一个BufferedImage对象,并初始化为null。

    BufferedImage bg = null;
    

    然后就是加载背景图片。

    try {
    	bg = ImageIO.read(new File("image/img1.png"));
    }catch(Exception e) {
    	e.printStackTrace();
    }

    最后,在重写paint方法,通过drawimage方法,将此背景图片绘制即可。

    public void paint(Graphics g) {
    	g.drawImage(bg, 0, 0, null);
    }

    这里最好使用双缓冲,不然可能会有闪屏神马的问题。关于双缓冲,在前面的博文里写过。

    THE END~


    展开全文
  • NetBeans.NetBeans中添加背景图片附源码。
  • Java登录界面的实现(注册、登录、背景图片

    万次阅读 多人点赞 2016-12-30 15:05:36
    */ ... * All rights reserved. * 文件名:text.java * 作者:常轩 * 微信公众号:Worldhello * 完成日期:2016年12月27日 * 版本号:V1.0 * 程序输入:无 ...登录界面有插入背景图片 实现了登录界...
  • java web课程设计,在线水果商城。如果选择用户登陆,则进入商品购买系统,首页为各个商品并且在首页可以进行用户登陆和新用户的注册,用户登陆或者注册之后,进行商品的购买,点击商品可以进入一个商品详情界面,...
  • Java数组倒置 简单 Java图片加水印,支持旋转和透明度设置 摘要:Java源码,文件操作,图片水印 util实现Java图片水印添加功能,有添加图片水印和文字水印,可以设置水印位置,透明度、设置对线段锯齿状边缘处理、水印...
  • 好消息,百度网盘专业搜索网站上线了 ...java"] package com.pic; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.Image; import java.aw...
  • java如何设置界面背景图片

    万次阅读 多人点赞 2015-05-28 15:45:28
    Java中,设置界面背景图片,首先了解窗体的层次结构。最底层:JRootPane;第二层是:JLayerPane;最上层就是ContentPane,也是平时最常用的内容面板。 方法一:思路图片放在JLayerPane层,组件放在ConentPane层,...
  • java编写界面设置 背景图片的大小

    千次阅读 2014-10-28 11:34:46
    设置背景图片大小跟电脑屏幕大小一致: 方法: ImageIcon background = new ImageIcon("res\\index_bgtdw.jpg"); Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize(); Image temp = ...
  • web初探-css-设置背景颜色和背景图像

    千次阅读 2019-08-01 23:48:28
    设置背景颜色 属性background-color eg: <body style = "background-color:red"> <p style = "background-color:green" >...使用图片来填充背景 属性background-image eg: <bod...
  • JAVA项目实现背景音乐

    2020-07-29 11:49:11
    直接上代码 1.同时下载jlayer.jar jar包 下面展示一些 内联代码片。 File file = new File("music/历经险恶 - 讲真的 (原唱_ 曾惜).mp3"); try { Player player = new Player(new FileInputStream(file));...
  • Java Web编程宝典-十年典藏版.pdf 是PDF电子书,不是源码。共分2个包。 《Java Web编程宝典(十年典藏版)》是一本集技能、范例、项目和应用为一体的学习手册,书中介绍了应用Java Web进行程序开发的各种技术、技巧。...
  • 书名:《Java Web开发实战1200例(第I卷)》(清华大学出版社.卢瀚.王春斌) PDF格式扫描版,全书分为6篇23章,共909页。2011年1月出版。 注:原书无书签。为了方便阅读,本人在上传前添加了完整的书签。 全书压缩打包...
  • Java Web编程宝典-十年典藏版.pdf 是PDF电子书,不是源码。共分2个包。 《Java Web编程宝典(十年典藏版)》是一本集技能、范例、项目和应用为一体的学习手册,书中介绍了应用Java Web进行程序开发的各种技术、技巧。...
  • Intellij IDEA如何设置背景图片

    万次阅读 2019-06-21 16:52:21
    比如我们想要更换IDEA的背景图片,我们可以安装一个叫Background Image Plus+的插件,就可以实现更换IDEA的背景图片了。 第一步: 在File–>setting下面找到plugin是,然后输入Background Image Plus+,点击...
  • Java Web实现简易的图书管理系统

    千次阅读 多人点赞 2020-09-21 14:30:50
    Java Web实现简易的图书管理系统 这是一个使用Java Web相关的知识做出来的网页图书管理系统,使用的数据库为mysql。 程序中实现了登录功能和对图书表、图书类别表的增删查改功能。 因为我对Java Web相关的知识的了解...
  • 想为JSP添加背景图,让JSP变得好看,但添加完后,图片在启动服务器后并不显示,该如何解决呢? 一、操作步骤 1.创建一个新的JSP页面 <%@ page contentType="text/html;charset=UTF-8" language="java" %> <...
  • 给网页添加背景图片htmlHow To Build a Website With HTML 如何使用HTML构建网站This tutorial series will guide you through creating and further customizing this website using HTML, the standard markup ...
  • 前端怎么给页面插入背景 1.整合nuxt和vue环境 注意事项:如果出现带括号的选项,记得按空格,括号内会出现星号(*) 例如: >(*) Axios ( ) Progressive Web App (PWA) Support ( ) DotEnv 总共有以下14个搭建...
  • CSS中控制背景图片的位置

    千次阅读 2017-03-06 15:26:12
    CSS中控制背景图片的位置
  • Java Web-----轮播图的实现

    千次阅读 2019-11-06 19:17:14
    图片板块 a. 首先,开辟一轮播图存放的板块,用ul,li来实现图片的存放 b.确保ul的长度放的下这5张图,并修改样式,使得图片水平排列并去除ul,li的样式等 按钮板块的样式 a.设置与图片数量相等的按钮,首先...
  • <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> String path = request.getContextPath(); String basePath = request.getScheme() + "://" + request.getServerName() + ":" +...
  • Java Web项目中中文乱码问题

    万次阅读 2018-07-07 10:46:32
    Java web中常见编码乱码问题(一) 最近在看Java web中中文编码问题,特此记录下。 本文将会介绍常见编码方式和Java web中遇到中文乱码问题的常见解决方法: 一、常见编码方式: 1、ASCII 码 众所周知,这是最...
  • 有时候我们再给一台什么都没有安装的windows系统上需要运行java web的项目,可能我们要做的就是在这个windows系统上再安装java、mysql、tomcat、然后再新建数据库,导入数据等等操作,如果对于非开发人员,这将会...
  • 一开始以为是图片路径不对,于是把img图片包放入了WEB-INF里,发现路径还是不对。 于是上网查找解决方案,在网上查询了很久,它们说的问题都是路径不对的问题,它们都是用的eclipse,工程结构也是略有不同的,只好...
  • Java Web简单搜索功能实现

    万次阅读 2019-07-23 17:40:06
    /* 表头及鼠标移动过 tr 时添加背景 */ background-color: #f1f1f1; } // onclick事件 function search() { // var $keyword = $("#keyword").val(); var $keyword = document.getElementById("keyword")...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 52,712
精华内容 21,084
关键字:

javaweb插入背景图片

java 订阅