导航:首页 > 万维百科 > 网页设计调整位置的代码

网页设计调整位置的代码

发布时间:2020-10-20 08:34:12

1、网页设计如何定义图片的位置和大小

网页设计在初始要界定出网页的尺寸大小.就像绘画给出一块画版来.这样才能方便设计. 网页的尺寸受限于两个因素:一个是显示器屏幕.显示器现在种类很多,以17寸为主流, 正在朝19寸及宽屏的方向发展.但目前也有为数不少的15寸显示器.另一个是浏览器软件,就是我们常用的IE,遨游,Firefox等.
高度:
高度是可以向下延展的,所以一般对高度不限制. 对于一屏来说,一般没有一个固定值,因为每个人的浏览器的工具栏不同,我见过有的浏览器工具栏被插件占了半个屏幕,所以高度没有确切值。
宽度:
1、在IE6.0下,宽度为显示器分辨率减21,比如1024的宽度-21就变成1003。但值得注意的是IE6.0(或更低)无论你的网页多高都会有右侧的滚动条框。 2、在Firefox下,宽度的分率辨减19。比如1024的宽度-19就变成1005 3、在Opear下,宽度的分率辨减23。比如1024的宽度-23就变成1001 注:Firefox或Opear在内容少于浏览器高度时不显示右侧滚动条。
所以如果是1024的分辨率,你的网页不如设成1000安全一点。设成900两侧空白更大,视觉上更舒服一点.也方便做一些浮动层的设计.
如果是800的分辨率一般都设成770。但也有设成760的.
这些需要明白并且牢记,不然很可能做出来不符合浏览器要求,不过一般我们都回设定的再稍微小一点,应为有些浏览器加了插件或者其他的东西宽度会有变化所以 800的分辨率一般设定760左右,1024的设定990左右.

网页设计标准尺寸:
1、800*600下,网页宽度保持在778以内,就不会出现水平滚动条,高度则视版面和内容决定。
2、1024*768下,网页宽度保持在1002以内,如果满框显示的话,高度是612-615之间.就不会出现水平滚动条和垂直滚动条。
3、在ps里面做网页可以在800*600状态下显示全屏,页面的下方又不会出现滑动条,尺寸为740*560左右
4、在PS里做的图到了网上就不一样了,颜色等等方面,因为WEB上面只用到256WEB安全色,而PS中的RGB或者CMYK以及LAB或者HSB的色域很宽颜色范围很广,所以自然会有失色的现象.
页面标准按800*600分辨率制作,实际尺寸为778*434px 页面长度原则上不超过3屏,宽度不超过1屏 每个标准页面为A4幅面大小,即8.5X11英寸
全尺寸banner为468*60px,半尺寸banner为234*60px,小banner为88*31px 另外120*90,120*60也是小图标的标准尺寸
每个非首页静态页面含图片字节不超过60K,全尺寸banner不超过14K
标准网页广告尺寸规格
一、120*120,这种广告规格适用于产品或新闻照片展示。 二、120*60,这种广告规格主要用于做LOGO使用。 三、120*90,主要应用于产品演示或大型LOGO。 四、125*125,这种规格适于表现照片效果的图像广告。 五、234*60,这种规格适用于框架或左右形式主页的广告链接。

六、392*72,主要用于有较多图片展示的广告条,用于页眉或页脚。 七、468*60,应用最为广泛的广告条尺寸,用于页眉或页脚。 八、88*31,主要用于网页链接,或网站小型LOGO。 广告形式 像素大小 最大尺寸 备注 BUTTON 120*60(必须用gif) 7K 215*50(必须用gif) 7K 通栏 760*100 25K 静态图片或减少运动效果 430*50 15K 超级通栏 760*100 to 760*200 共40K 静态图片或减少运动效果 巨幅广告 336*280 35K 585*120 竖边广告 130*300 25K 全屏广告 800*600 40K 必须为静态图片,FLASH格式 图文混排 各频道不同 15K 弹出窗口 400*300(尽量用gif) 40K BANNER 468*60(尽量用gif) 18K 悬停按钮 80*80(必须用gif) 7K

流媒体 300*200(可做不规则形状但尺寸不能超过300*200) 30K 播放时间 小于5秒60帧(1秒/12帧) 网页中的广告尺寸 1.首页右上,尺寸120*60 2.首页顶部通栏,尺寸468*60 3.首页顶部通栏,尺寸760*60 4.首页中部通栏,尺寸580*60 5.内页顶部通栏,尺寸468*60 6.内页顶部通栏,尺寸760*60 7.内页左上,尺寸150*60或300*300 8.下载地址页面,尺寸560*60或468*60 9.内页底部通栏,尺寸760*60 10.左漂浮,尺寸80*80或100*10

2、网页设计中怎么调整层关系

设置z-index值,值越大越在上层,最小为-1

3、网页制作中插入表格怎么调整位置

通常有以下几种方法:
1、CSS法
可以在<table>标签中设置margin属性,即:style="margin:5px 0 5px 0;"(顺序:上、右、下左,亦可简写为style="margin: 5px 0;"),这段CSS的作用是在当前表格外部的上下各留出5px的空白。
2、空对象法
(1)空行。还可以在表格后敲回车换行,产生<p></p>标签,或者按Shift+回车软换行,产生<br>标签,都可产生一个空行。
(2)空表格。插入一个1行1列的表格,设置单元格的宽度、高度,在单元格中不输入内容。当单元格高度小于12px时,一定要将空格符 删掉,否则达不到设定高度,这一点非常重要。即:
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="5"></td>
</tr>
</table>
(3)空DIV。类似于空表格,插入一个DIV,设置其宽度、高度,超出隐藏即可。
<div style="width:100px;height:5px;overflow:hidden;clear:both;"
3、透明图片法
可以在PS中新建一个5x5px的画布,背景设为透明,保存为透明GIF图片,然后在需要留间距的表格后面插入这个透明图片,将其宽度、高度可以任意调整,直到满意为直。
<img src="null.gif">

4、HTML中如何设置插入图像的位置?

<img src="ad-02.jpg" width="400px"; height="200px"; style="position:absolute; left:100px; top:100px; ">修改left 和top的值。

5、制作网页时怎么一边写代码一边调试

一、iOS+Safari1、打开手机web检查器。通过【设置】>【Safari】>【高级】>【Web检查器】打开。见下图(点击查看大图),并且你会看到该选项下面对电脑操作的相应描述,照做就好。2.链接电脑(Mac)2.1先在手机Safari中打开你想调试的网页,并用数据线连接到电脑(我这里是Mac)2.2再在电脑上打开Safari点击【Develop】菜单,就会看到如下图所示(点击查看大图):3.3点击2.2中的网站名就会在电脑上打开Safari的控制台,如下图(点击查看大图):3.调试网页如上3.3图所示,此时你可以查看手机网页的DOM结构,并且和电脑端网页调试无异,当鼠标滑过这些DOM节点的时候手机上的相应布局也会高亮起来,如下图(点击查看大图):二、Android+Chrome1.设置手机1.1【设置】>【关于手机】>【版本号(Buildnumber)】,对版本号这一项连点7下(这是官方文档里的说法)就会提示“你已成为开发者”。1.2再返回【设置】>【开发者选项】>【USB调试】打开手机USB调试。2.设置电脑(Mac)这块比较麻烦,因为要装一下Android的SDK。2.1下载AndroidSDK,并解压,我把整个adt目录放在了/Users/David/adt/这里。2.2设置环境变量。打开终端在David路径下(形如DaviddeMacBook-Pro:~David$)输入open.bash_profile,如果文件存在则会打开,如果不存在则再输入touch.bash_profile创建并打开这个文件。在文件里输入exportPATH=$PATH:/Users/David/adt/sdk/platform-tools:/Users/David/adt/sdk/tools,关闭保存。最后在终端里输入source.bash_profile来更新环境变量使其生效。终端里输入adb出现命令帮助信息就是成功了。2.3在终端里输入adbforwardtcp:9222localabstract:chrome_devtools_remote。3.链接电脑3.1在手机上的Chrome里打开想要调试的网页,用数据线连接手机和电脑(我的是Mac。唉~我只是强调平台的不同,不要误会)。3.2打开电脑上的Chrome,在地址栏里输入about:inspect选中【DiscoverUSBDevices】前面的复选框。出现下图画面(点击查看大图):4.调试网页4.1你可以点击图3.2中检测到的设备上正在运行的网站下面那个【inspect】,或者在浏览器中输入localhost:9222打开手机正在浏览的网页列表,如下图:4.2点击上图中的网站缩略图,就会跳转到Google的一个代理链接(链接可能被墙……,挂代理)就会打开如下图所示的控制台(点击查看大图):4.3这就和电脑上网页调试没什么差别了,鼠标经过DOM节点,手机上的布局同样也会高亮起来:

6、急急急,求大神,网页制作插入图片如何改变位置?

设置下它的CSS样式吧,水平居左对齐:text-align:left;垂直居顶部对齐:vertical-align:top,这样就会在左上角了呢

7、请问在网页制作中怎么调整文字的位置?

找开Dreamweaver后出现可以编辑界面的时候下面有个属性栏,在属性栏就可以调整文字的位置

8、网页设计中如何调整行间距?

字体的行间距你可以用line-height这个属性去设置

9、如何调整背景色位置(网页制作)

你这个不就是在用DW写代码吗?把backgound-color属性值改为蓝色就可以了

10、网页制作模块的位置怎么调啊

方法一:设置个样式:
<style type="text/css">
body{padding:0; margin:0 auto;}
</style>

方法二:如果上面方法不行的话,就在这样:
<html>
<head>
<style type="text/css">
#body{width:100%; height:auto; padding:0; margin:0 auto;}
</style>
</head>

<body>
<div id="body">(页面内容)</div>
</body>
</html>

与网页设计调整位置的代码相关的知识