导航:首页 > 万维百科 > 网页设计切换页面模板

网页设计切换页面模板

 发布时间：2020-11-10 21:16:21

1、网页模板-我就想要实现小图切换大图的效果的制作步骤与教程

<style type="text/css">
body{
margin:0;
padding:40px;
background:#fff;
font:80% Arial, Helvetica, sans-serif;
color:#555;
line-height:180%;
}
img{border:none;}
ul,li{
margin:0;
padding:0;
}
li{
list-style:none;
float:left;
display:inline;
margin-right:10px;
border:1px solid #AAAAAA;
}

/* tooltip */
#tooltip{
position:absolute;
border:1px solid #ccc;
background:#333;
padding:2px;
display:none;
color:#fff;
}
</style>
<script type="text/javascript">
//<![CDATA[
$(function(){
var x = 10;
var y = 20;
$("a.tooltip").mouseover(function(e){
this.myTitle = this.title;
this.title = "";
var imgTitle = this.myTitle? "<br/>" + this.myTitle : "";
var tooltip = "<div id='tooltip'><img src='"+ this.href +"' alt='产品预览图'/>"+imgTitle+"<\/div>"; //创建 div 元素
$("body").append(tooltip); //把它追加到文档中
$("#tooltip")
.css({
"top": (e.pageY+y) + "px",
"left": (e.pageX+x) + "px"
}).show("fast"); //设置x坐标和y坐标，并且显示
}).mouseout(function(){
this.title = this.myTitle;
$("#tooltip").remove(); //移除
}).mousemove(function(e){
$("#tooltip")
.css({
"top": (e.pageY+y) + "px",
"left": (e.pageX+x) + "px"
});
});
})
//]]>
</script>

</head>
<body>

<ul>
<li><a href="images/apple_1_bigger.jpg" class="tooltip" title="苹果 iPod"><img src="images/apple_1.jpg" alt="苹果 iPod" /></a></li>
<li><a href="images/apple_2_bigger.jpg" class="tooltip" title="苹果 iPod nano"><img src="images/apple_2.jpg" alt="苹果 iPod nano"/></a></li>
<li><a href="images/apple_3_bigger.jpg" class="tooltip" title="苹果 iPhone"><img src="images/apple_3.jpg" alt="苹果 iPhone"/></a></li>
<li><a href="images/apple_4_bigger.jpg" class="tooltip" title="苹果 Mac"><img src="images/apple_4.jpg" alt="苹果 Mac"/></a></li>
</ul>

</body>
你再去下个jquery的库就行了

2、求网页设计的模板，有几个页面的那种，打开就可以用，相关控件代码可以自己写的，

这个应该是学校的期末作业或者毕业设计，需要几个链接页面，如主页，列表页，内容页等等。网页模板相对都是比较成熟的，精美的。所以需要你自己修改成自己想要的页面，就是美工修改下。这里有些html的静态页面的网页模板www.drame.cn和mb5u.com，免费下载的，希望能找到你满意的

3、DW怎么把首页设为模板，子网页用模板设计

刚进入dreamweaver点击新建下方的更多，然后选择空白页，页面类型选择html模板，布局选无就行了。

插入一个表格（菜单栏中选择插入，再找到表格），表格里的布局自己根据需要设置，在这里我设置为行数为5，列为1，表格宽度为1000像素。插入表格后，选中整个表格，选中后表框会加黑加粗，在下方设置为居中对齐。

在表格第一行插入图像（菜单栏中选择插入，再找到图像），第二行加入滚动字幕。第三行插入表格（方法同上），1行4列，表格宽度为百分之一百。插入表格之后，再选中第三行的表格，选中后表格边框会加黑加粗，在下方设置表格为居中对齐，宽度为20%。

第三行中选入一些文字，如首页，李白，杜甫，白居易。新建一个css文件，再建一个css，设置好类型中的颜色和背景中的颜色，加以区分。选中第三行，使用刚才新建的css，再新建一个css，表格的边框使用该css。

在第四行插入可编辑区域。点击确定，可编辑区域中的文字即EditRegion3可以去掉，换行可以扩大可编辑区域的面积。

在第五行插入可编辑区域，我还插入了一条水平线，并加上了版权。最后保存。此时模板已经建好。

新建，模板中的页，找到新建的模板，创建，保存为index.html（即网站的主页）,再重新打开新建的模板，在可编辑区预报输入李白的资料，保存为li.com，此时你会发现只有在可编辑区域才能输入内容，其他区域都是不可操作的，这就是模板的特点。同理，在新建两个作为杜甫和白居易的网页。

现在就差用超链接把上面做的几个网页连接起来了。在模板中选中首页，在下方html中的链接中输入首页的名称，即index.html，同理，选中李白，杜甫，白居易将他们连起来。超链接做好后在文字下方会多出一条横线。

做完了之后在index.html中打开可以看看做出的效果，点击图中的小地球图标就可进行查看。

4、初次html网页设计，为何每一页导航条会随着翻页而时大时小？我用的是同一个网页模板，谢谢

如果你的css定位的尺寸一样大的话，你对页面放大或缩小，不会改变你的页面定位的原尺寸，只是对页面进行放大了而已
如果你在翻页查看发现也没尺寸不一样，你看看你的页面是否都是按100%显示，如果不是按ctr+鼠标滚轮进行调整一致的比例，再看看是否一样

5、网页设计时 如何在同一个网址一个模板下 显示不同的网页

友情链接

6、如何把现有网页转变为模板

如果看到自己喜欢的网页，可以将其转换为自己网站的模板。
一、主页另存为main.htm，文章列表页面另存为listcolumn.htm，文章页另存为displayinfo.htm，注意文件名必须丝毫不能偏差，更不能用中文。扩展名必须是.htm，html或其他均不行。


二、将主页中信息列表的信息删除，换成Webplus的标签“[频道i]”，标题名换成标签“[标题i]”，注意频道外面一定要套表格。

三、将listcolumn页面的相应位置输出的信息替换成Webplus的标签，如新闻列表替换成“[文章列表]”，具体标签可以通过下载通用模板来学习或查找后面附的标签对照表。

四、将displayinfo.htm页面的相应位置输出的信息替换成Webplus的标签，如新闻标题替换成“[文章标题]”，具体标签可以通过下载通用模板来学习或查找后面附的标签对照表。

五、打开文件夹，选中所有文件，添加到zip压缩文件，如下图：


通过以上几个步骤，您就可以获得一套Webplus模板了，即使您不是专业美工，您也可以通过以上的过程学习Webplus制作技巧，讲您喜欢的页面转化为webplus的模板。

7、网页设计模版是什么,怎么利用网页设计模版?

网页模板就是已经做好的网页框架，使用网页编辑软件输入自己需要的内容，再发布到自己的网站。每个网页模板压缩包内包含：PSD图片文件(可用Photoshop、ImageReady或Fireworks修改)，按钮图片PSD文件、Flash源文件和字体文件，推荐使用Dreamweaver软件向网页模板添加内容。

创建和设置

1)模板的概念：作为创建其它文档的样板的文档。创建模板时，可以说明哪些网页元素不可编辑，哪些元素可以编辑。其扩展名为.dwt。

2)模板的作用：有利于保持网页风格的一致;提高工作效率。

1.创建模板

1)创建一个全新的模板：在模板面板中，使用快捷菜单按钮或单击面板上的新建按钮

模板面板的打开：Window菜单--Templates

2)创建基于文档的模板：File菜单-Save As Template

2.设置模板页面属性

1)用模板创建的文档继承模板的页面属性，页标题除外。

2)设置：Modify菜单-Page Properties

3.定义模板的可编辑区

1)定义模板的可编辑区

在模板文档中选定对象、Modify菜单、Templates、New Editable Region

2)取消可编辑区标记

Modify菜单-Templates-Remove Editable Region

应用和更新

1.应用模板创建文档

1)应用模板创建文档

使用模板创建新文档：File菜单-New From Template

或：File菜单-New-从模板面板中拖一个模板到文档

对现有文档应用模板：Modify菜单-Templates-Apply Template to Page-模板面板中选定模板-单击Select

或：从模板面板中拖一个模板到文档中

或：从模板面板中选定一个模板，单击Apply

2)可编辑区和锁定区

在应用了模板的文档中，只有可编辑区的内容才可以修改。

3)把页面从模板中分离出来

如果要对应用了模板的页面的锁定区进行修改，必须先把页面从模板中分离出来。

具体操作：Modify菜单-Templates-Detach From Template

2.修改模板

在模板面板中选定模板、单击编辑按钮或双击模板名称或使用快捷菜单的Edit、编辑完成后保存

3.更新站点中使用模板的所有文件

Modify菜单-Templates-Update Pages

与网页设计切换页面模板相关的知识