明星个人网页设计html（个人网页怎么制作）

本文目录

• 个人网页怎么制作
• 个人网页设计背景图片-html网页制作中如何设置背景图片（如何引用）
• 如何用HTML语法制作个人主页
• 用HTML设计一个自我介绍的网页 感谢

个人网页怎么制作

个人网页制作如下：

你首先做一个小计划，准备在主页上告诉人家什么？比如介绍三个方面：自我介绍，我的爱好，我的工作，那你就先起一个总目录（文件夹，比如d：\html），来放你的所有文件，然后再在这个目录建立三个子目录：myself，interest，job。

文件名你可以任意，但最好全部小写，因为有的主机要认大小写。然后将你的材料copy进相应的子目录。比如你要在你的主页里展示你的靓照，那就将你的照片扫描成JPG格式的文件，放在myself的目录下。

要注意，网上只能使用JPG和GIF两种图像格式，其他诸如BMP和TIF等很通用的格式都不能用在网上，因为它们太大了，但你可以用图像软件进行转换，比如Office 97的照片器。把你准备在你主页上出现的图像放进相应的目录里后，你就可以开始制作了。

网上安家

要在网上安你自己的家，你必须先申请一个主页空间，即向某一个主机申请一块硬盘空间。有较多的主机提供免费主页空间，具体见实用链接栏目。这些主机不仅提供免费个人主页空间，并且还提供留言簿、计数器等很有用的功能。只要到有关站点申请即可。

需要注意的是，一定要保持网页的相对位置，否则会看不到网页的，有很多朋友都问我:为什么我的网页传上去了可是看不到,老是出现网页错误呢？其实他们都是因为位置的问题，只要把位置改动一下就可以的了。

个人网页设计背景图片-html网页制作中如何设置背景图片（如何引用）

如何给个人网页设置背景图片啊?

背景图片代码

方法一:

文章的时候点击创建表格后在弹出的窗口中把边框设置为0,然后填上背景图片的链接地址就好了

也可以用代码:

《TABLEheight=600width=600background=你的背景图片地址border=0》

《TBODY》

《TR》

《TD》你的主体内容《/TD》《/TR》《/TBODY》《/TABLE》

方法二:

《bodybackground=你的背景图片地址》

方法三:

《STYLEtype=text/css》《!--body{background-image:url(你的背景图片地址);background-repeat:no-repeat;background-attachment:fixed;background-position:50%50%}--》《/STYLE》

方法四:

背景图是在HTML模式下把以下代码加到已有代码最前面:

《bodybackground="图片地址"》

注:图片地址必须是网络上已有的图片,不是本地机的,如果要链接本地机的,必先在相册或者其他文章上传之后才可以调用。

方法五:

《STYLETYPE="text/css"》

《!--

BODY{background-image:URL(图片名称.gif);

background-position:center;

background-repeat:no-repeat;

background-attachment:fixed;}

--》

《/STYLE》

网页背景全攻略

网页中的背景设计是相当重要的,尤其是对于个人主页来说,一个主页的背景就相当于一个房间里的墙壁地板一样,好的背景不但能影响访问者对网页内容的接受程度,还能影响访问者对整个网站的印象。如果你经常注意别人的网站,你应该会发现在不同的网站上,甚至同一个网站的不同页面上,都会有各式各样的不同的背景设计。究竟都有哪些不同样式的背景,还有它们的设计方法都是怎样的呢,现在就由我来为大家作一个比较完整的总结。

1.颜色背景

颜色背景的设计是最为简单的,但同时也是最为常用和最为重要的,因为相对于图片背景来说,它有无与伦比的显示速度上的优势。在网页文件中,一般通过标签来指定页面的颜色背景,其HTML语法为:

其中的"color"表示不同的颜色,可以用各种不同的颜色表示方法,比较常用的有直接用颜色的英文名称,如blue、yellow、black等等,还可以用颜色的十六进制表示方法,如#0000FF、#FFFF00、#000000等等,此外还可以用百分比值法和整数法,其效果都是一样的。

颜色背景虽然比较简单,但也有不少地方需要注意,如要根据不同的页面内容设计背景颜色的冷暖状态,要根据页面的编排设计背景颜色与页面内容的最佳视觉搭配等等。

2.沙纹背景

沙纹背景其实属于图片背景的范畴,它的主要特点是整个页面的背景可以看作是局部背景的反复重排,在这类背景中以沙纹状的背景是为常见,所以我们将其统称为沙纹背景。

初学主页制作者都有这样的经历,当试图把自己的照片作为页面的背景是,却发现浏览器上显示出来的不仅仅是一个照片,而是同一照片在水平和竖直方向上的反复排列。这就是浏览器处理图片背景时的规律方法,利用这一规律我们可以用一小块图片作为页面背景,让它自动在页面上重复排列,铺满整个页面,从而使网页的体积大大减小。

读者到现在恐怕都已经知道了沙纹背景的原理和实现方法,就是找一个小的图片,越小越好,但注意要使最后的背景看起来要像一个整体,而不是若干图片的堆砌。其实现的HTML语法如下:

其中的"picture"表示背景图片的URL路径。

3.条状背景

条状背景与沙纹背景是比较相似的,它适用于页面背景在水平或竖直方向上看是重复排列的,而在另一方向上看则是没有规律的。它也是利用浏览器对图片背景的自动重复排列,与沙纹背景所不同的是它只让图片在一个方向上重复排列。

以在竖直方向上排列为例,首先用图像处理软件做一个从左到右为蓝白渐变的水平条状图片,其长度与页面的宽度相当。也通过

将其设为页面背景,经浏览器显示后,就成为整个页面从左到右蓝白渐变的分栏颜色背景。当然,也可以用类似的方法实现条状背景在水平方向上的重复排列。

4.照片背景

把自己或朋友的照片作为页面的背景让大家看到,是有点令人激动的事情,但浏览器对图片的自动重复排列却使这一愿望难以实现。怎么办呢?只有想不到的,没有做不到的,这里我们用上一点简单的CSS。在网页文件的之间加入下面的CSS语句:

这样,在网页页面中,就可以看到你的照片位于页面的正中间,而且在拉动浏览器窗口的滚动条时,照片仍然位于页面的正中间而不随页面内容一起滚动。如果你觉得照片位于页面的正中间不满意,你也可以随意地调整它在页面中的位置,只需要调整"background-position"的值就可以了。

5.复合背景

如果你在练习上面的“照片背景”时“不小心”也设置了标签里的颜色背景,那么你看到了什么?颜色背景还起作用吗?对,你能看到你的照片浮于你设的颜色背景之上,二者能够同时正常地显示出来。这就是复合背景的魅力,更为吸引人的是,当你所设置的图片背景因为某种不可知的因素而不能正常显示的时候,浏览器能够自动用你所设置的颜色背景取而代之。它的设计方法,就不用我再多说了吧!

6.局部背景

前面我们所说的背景都是整个页面的背景,能不能在页面上为某个局部的内容设置属于它自己的背景呢?回答是肯定的。

最为常见的是在表格的设计当中,我们可以为表格设置一个不同于页面的背景,甚至在不同的表格单元中,我们也可以设置各个表格单元自己的背景。请看下面这个表格例子:

在浏览器中的显示效果如图所示,可以看到,不但对于表格整个来说有不同于页面的背景,就是每一个单元格也可以设置各不相同的背景。

除此之外,我们还可以单独为某个文字段落设置背景,甚至为这个文字段落中的某几个文字设置自己的背景,是不是有点相当不错,这也需要用上一些CSS。请先看一下下面的这个例子:

不仅仅是页面的背景

记得毛主席有这么一首诗:"坐地日行八万里,巡于遥看一千河。"伟人就是了不起,几万里就出去了。

在浏览器中的显示效果如图所示,现在是不是有点兴奋了,啊,原来文段也可以有自己的背景。只要你愿意,你就可以为页面的任何一个部分定义自己的背景,从而把页面打扮得更加漂亮和吸引人。

有关背景图片

方法一:文章的时候点击创建表格后在弹出的窗口中把边框设置为0,然后填上背景图片的链接地址就好了

也可以用代码:

《TABLEheight=600width=600background=你的背景图片地址border=0》

《TBODY》

《TR》

《TD》你的主体内容《/TD》《/TR》《/TBODY》《/TABLE》

方法二:

《bodybackground=你的背景图片地址》

图片链接

《Ahref="你要链接的地址"target=_blank》《IMGheight=31alt=你的文字介绍src="你的图片(或logo地址)"width=88border=0》《/A》

高和宽在上边的height和width那里设置

1、首先打开Atom器导入项目文件夹,先创建一个的文件。定义一下html文件的主信息:

2、然后填写自己的网页内容,_柚靡幌卵,直接在body后面加上background="图片名字"即可插入图片:

3、最后来到浏览器,刷新一下网页,这样就会显示背景了:

要把图像放入背景,需要使用background-image属性。background-image属性的默认值是none,表示背景上没有放置任何图像。

如果需要设置一个背景图像,必须为这个属性设置一个URL值:

body{background-image:url(/i/eg_bg_);}

大多数背景都应用到body元素,不过并不仅限于此。

下面例子为一个段落应用了一个背景,而不会对文档的其他部分应用背景:

p.flower{background-image:url(/i/eg_bg_);}

您甚至可以为行内元素设置背景图像,下面的例子为一个链接设置了背景图像:

a.radio{background-image:url(/i/eg_bg_);}

理论上讲,甚至可以向textareas和select等替换元素的背景应用图像,不过并不是所有用户代理都能很好地处理这种情况。

另外还要补充一点,background-image也不能继承。事实上,所有背景属性都不能继承。

背景重复

如果需要在页面上对背景图像进行平铺,可以使用background-repeat属性。

属性值repeat导致图像在水平垂直方向上都平铺,就像以往背景图像的通常做法一样。repeat-x和repeat-y分别导致图像只在水平或垂直方向上重复,no-repeat则不允许图像在任何方向上平铺。

默认地,背景图像将从一个元素的左上角开始。请看下面的例子:

body

{

background-image:url(/i/eg_bg_);

background-repeat:repeat-y;

}

如何用HTML语法制作个人主页

现在的个人主页一般已经不只用HTML来编写了，但是作为网页的最基础内容，还是需要学的，毕竟并不难。你自己在网上搜索一下HTML就可以找到一大堆的教程了，大部分大同小异。
在学HTML之前，建议你用即看即得的网页器，如DreamWeaver, frontpage等，先做一个简单的页面。在形成一个对网页制作的初步印象后再学网页背后的代码。
学了HTML后再继续用网页器做一个更复杂一点的网页，这样你就可以进代码模式看网页背后的代码了。这时你已经可以看懂大多数HTML代码了，不懂的可以通过搜索找到答案。
然后，你可以接着学脚本，可网页的图像设计方面等等，慢慢向高级进阶。

用HTML设计一个自我介绍的网页 感谢

《style》
.content》.name{font-size:16px; color:blue}
.home{font-size:18px; color:red}
#address{font-size:20px; color:gray}
.btn》a,.btn》input{color:green;display:block;width:120px;height:60px}
.btn》a:hover,.btn》input:hover{color:yellow;}
《/style》
《DIV class="content" style="background:url(’img.jpg’)"》
《div class="name"》
我叫XXX
《/div》
《div class="home"》
我的家乡XXX
《/div》
《div id="address"》
我在xxxx
《/div》
《div  class="btn"》
《a》确定《/a》
《input type="button" value="确定"/》
《/div》
《/DIV》