eclipse项目的图片的绝对路径和相对路径及图片与表单居中

12小白

于 2015-01-30 17:14:56 发布

阅读量7.2k

点赞数 1

分类专栏： html+css+js 文章标签： css 居中

本文链接：https://blog.youkuaiyun.com/u012270113/article/details/43309253

版权

html+css+js 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了在Eclipse项目中如何处理图片的绝对路径和相对路径，强调了在项目发布时使用相对路径的重要性，并解决了中文命名图片无法加载的问题。同时，讨论了实现图片和表单居中的CSS技巧，特别是当text-align和vertical-align无法达到预期效果时，采用绝对定位和margin调整的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.图片的绝对路径和相对路径

eclipse中项目如下：

绝对路径不会错：例如下图中2.jpg的绝对路径如下：

但是一般项目是需要发布的，这样绝对路径就失效了。需要使用相对路径，这时，我就栽了跟头。因为图片命名是以中文命名的，导致死活出现加载图片失败。正确的是应该用英文命名。

2.图片和表单居中

图片居中text-align:center;vertical-align:middle;但是表单居中text-align:center;vertical-align:middle;一般不起作用。

我是通过设置绝对定位以及调节margin 来完成的。具体如下

<div  style="position:absolute;top:50%; left:50%;margin:-100px 0 0 -300px;text-align:center;vertical-align:middle;">
	<img src="images/3.jpg"  style="width:300px;height:105px;"/>
	<form  id="search" name="search" action="search" method="get">
		<input id="word" name="param" type="text" style=" width:500px; height:30px;">
		<input style="color: blue;width:80px; height:30px;" type="submit" value="查询" >
	</form>
</div>