zoukankan      html  css  js  c++  java
  • 网页设计问题大搜集

    Q: 表格内的文字不会自动换行,怎么办?
    A: 有两种可能的情况:
    第一种,你用CSS把表格内文字的字体设置成了英文字体,这样在DW里表格内的文字不会自动换行,但这仅是DW里的显示效果,在IE里其实是可以正常换行的。如果希望在DW的编辑状态也能使文字自动换行,把表格内文字的字体设置为中文字体即可(例如“宋体”)。
    第二种,你在表格中输入了连串无空格的英文或数字,它们被IE识别为一个完整的单词,所以不会自动换行,遇到这种情况,你可以通过CSS把文字强行打散,例如:
    <td style="word-break:break-all">……</td>

    Q: 怎么才能让层飘在Flash上面?
    A: 在网页里把SWF文件设置为背景透明即可,具体做法:
    DW中,在SWF文件的属性面板中,点parameters,添加参数wmode,值选择transparent;
    或者直接修改网页的代码,在标志SWF文件属性的代码中添加:
    <param name="wmode" value="transparent">
    注意,这种效果只有IE支持。

    Q: 如何让一个图片或表格在页面中始终保持横向和纵向的居中?
    A: 首先插入一个1行1列的表格,设置其宽度为100%、高度也为100%,边框为0。
    然后设置单元格的属性,设置其内容的水平对齐方式和垂直对齐方式均为居中。
    最后在这个单元格插入图片或表格,就可以保持内容在页面内横向和纵向都居中显示了。

    Q: 背景音乐因为页面的切换而无法连续播放,怎么让它连续播放?
    A: 用分帧实现,把其中一个frame的显示高度(或宽度)定义为0,在其中设置背景音乐,另外一个frame内的页面切换不影响整个背景音乐的播放。
    例子:
    <html>
    <head>
    <title>框架页</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    </head>

    <frameset rows="0,*" frameborder="NO" border="0" framespacing="0">
    <frame name="topFrame" scrolling="NO" noresize src="bgsound.htm" >
    <frame name="mainFrame" src="main.htm">
    </frameset>
    <noframes>
    <body bgcolor="#FFFFFF" text="#000000">
    对不起,你的浏览器不支持框架的显示。
    </body>
    </noframes>
    </html>

    Q: 半透明的层怎么做?
    A: 先定义一个CSS样式:
    <style type="text/css">
    <!--
    .halfalpha { background-color: #000000; filter: Alpha(Opacity=50)}
    -->
    </style>
    然后应用在层标签里:
    <div class="halfalpha">

    Q: 层在不同分辨率下发生错位,怎么办?
    A:解决方法有二:
    1、页面居左显示;
    2、使用层的相对定位,关于相对定位你可以参考这篇文章:
    http://www.windstudio.net/tech/show.asp?id=37

    Q: 如何实现“设为首页”、“添加到收藏夹”?
    A: 设置为首页:
    <a href="#" onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.windstudio.net');">设为首页</a>
    加入收藏:
    <a href="javascript:window.external.AddFavorite('http://www.windstudio.net', '有风的日子·带给你一阵清新的设计风')">加入收藏</a>

    Q: 如何制作细线表格?
    A: 表格细线边框的做法
    方法1:把表格的cellspacing设置为1,cellpadding和border均为0,分别填充表格的背景色和单元格的背景色。举例如下:
    <table width="550" border="0" cellspacing="1" cellpadding="0" bgcolor="#666666">
    <tr bgcolor="#FFFFFF">
    <td>&nbsp;</td>
    </tr>
    <tr bgcolor="#FFFFFF">
    <td>&nbsp;</td>
    </tr>
    </table>

    方法2:把cellspacing、cellpadding、border均设置为1,分别设定表格的边框色和内部单元格的边框色,注意使内部单元格的边框色和网页背景色或表格背景色相同,这样内部的边框看上去就和背景融为一体了。举例如下:
    <table width="550" border="1" cellspacing="1" cellpadding="1" bordercolor="#666666">
    <tr bordercolor="#FFFFFF">
    <td>&nbsp;</td>
    </tr>
    <tr bordercolor="#FFFFFF">
    <td>&nbsp;</td>
    </tr>
    </table>

    方法3:用CSS定义表格的边框宽度为1个像素。先设置CSS类table1 { border-top: 0px; border-right: 0px; border-bottom: 0px; border-left:0px},然后在<table>标签里添加class="table1"。

    方法4:做一个和表格等大的图片作为表格的背景,尤其当你想使表格边线有倒角时。

    Q: 如何安装和使用.mxp格式的DW插件?
    A: 要求装有插件管理器,DW4已经将插件管理器整合其中,无须另外安装。DW3需要另外安装,您可以从本站的酷软下载栏目中下载。
    安装完插件管理器后,双击.mxp格式的文件,一路选择YES,插件就会自动安装到DW中,这样你就可以在DW的菜单中找到该插件了。
    要注意不同类型的插件会在DW不同的菜单或面板里找到,插件管理器会告诉你该插件的类型(object、command、behavior或其他)、功能和用法。

    Q: 怎样打开一个全屏的IE窗口?
    A: 用JavaScript来实现:
    定义过程:
    <script language="JavaScript">
    <!--
    function MachakFull(Ie,other){
    x=screen.availWidth;
    y=screen.availHeight;
    target = parseFloat(navigator.appVersion.substring(navigator.appVersion.indexOf('.')-1,navigator.appVersion.length));
    if((navigator.appVersion.indexOf("Mac")!=-1) &&(navigator.userAgent.indexOf("MSIE")!=-1) &&(parseInt(navigator.appVersion)==4))
    window.open(other,"sub",'scrollbars=yes');
    if (target >= 4){
    if (navigator.appName=="Netscape"){
    var MachakFull=window.open(other,"MachakFull",'scrollbars=yes','width='+x+',height='+y+',top=0,left=0');
    MachakFull.moveTo(0,0);
    MachakFull.resizeTo(x,y);}
    if (navigator.appName=="Microsoft Internet Explorer")
    window.open(Ie,"MachakFull","fullscreen=yes");
    }
    else window.open(other,"sub",'scrollbars=yes');
    }
    //-->
    </script>

    调用函数:
    <a href="javascript:;" onClick="MachakFull('index.htm','')">点这里打开一个全屏窗口</a>

    Q: 怎么做无边的IE弹出窗口?
    A: 这种窗口叫Chromeless Window,用一个DW插件就可以实现这种效果。
    插件名称:Chromeless Window 完美修正版
    下载地址:http://www.windstudio.net/dw/files/...ss_win_wind.mxp

    Q: 如何去除浏览器的“滚动条”?
    A: <body scroll=no>
    去掉水平滚动条:
    <body style="overflow-x: hidden">
    去掉竖直滚动条:
    <body style="overflow-y: hidden">

    Q: 怎么让下拉列表的链接在新窗口中显示?
    A: <select name="designlink" onChange="window.open(this.options(this.selectedIndex).value);">
    <option selected>设计站点链接</option>
    <option value=http://www.pcicp.com>蔫老虎网站</option>
    <option value=http://bbs.pcicp.com>蔫老虎论坛</option>
    <option value="http://www.colorbird.com">技术性文章</option>
    </select>

    Q: 如何实现两种不同的链接效果?
    A: 在CSS中设置不同的类(CLASS),例如:
    a.w1:link {text-decoration:none;color:#000066}
    a.w1:visited {text-decoration:none;color:#333333}
    a.w1:hover {color:#0000ff;text-decoration:underline}
    a.w2:link {text-decoration:none;color:#000066; font-weight:bold}
    a.w2:visited {text-decoration:none;color:#000066; font-weight:bold}
    a.w2: hover{color:#FF0000; font-weight:bold}

    不同的链接调用不同的CSS类即可,例如:
    <a href="#" class="w1">123</a>
    <a href="#" class="w2">456</a>

    也可以直接在DW中操作,例如:
    1、打开css style面版选择use css selector
    2、选择a:link,定义样式,接下来选择a:hover再定义样式
    3、同样方法再建立一个链接样式a.w1(名称可任意):link 和a.w1:hover
    4、第二步所建立的样式会以默认值自动写入文档,当需要使用第二种样式时,选中链接文字,在右键快捷菜单中选择新样式(第三步建立的样式,这里为w1),搞定。

    Q: 怎样用CSS改变鼠标指针样式?
    A: <span style="cursor:X"></span>
    这里选择cursor(文本)作为对象,还可以自己改为其他的,如link等。
    x可以等于=hand(手形)、crosshair(十字)、text(文本光标)、wait(顾名思义啦)、default(默认效果)、help(问号)、e-size(向右箭头)、ne-resize(向右上的箭头)、nw-resize(向左上的箭头)、w-resize(向左的箭头)、sw-resize(左下箭头)、s-resize(向下箭头)、se-resize(向右下箭头)、auto(系统自动给出效果)

    Q: 如何解决DW4不能使用五笔输入法的问题?
    A: 选择菜单Edit→Preferences,在Category列表中选择General,取消复选框Enable Double-Byte Inline Input既可。取消复选框Enable Double-Byte Inline Input后,所有的中文输入法(包括五笔字型输入法V4.5)均恢复正常!

    Q: 怎么样让在800*600分辨率下生成的网页在1024*768下居中显示?
    A: 把页面内容放在一个宽为778的大表格中,把大表格设置为水平方向居中。宽度定为778是为了在800*600下窗口不出现水平滚动条,你也可以根据需要进行调整。
    如果要加快关键内容的显示,也可以把内容拆开放在几个竖向相连的大表格中~~
    除了使用表格之外,你也可以把要居中的部分用<div align=center>和</div>标签包围起来。

    Q: 怎么实现在不同页面间通过链接跳转时,IE地址栏的显示地址不变?
    A: 用分帧实现,把其中一个frame的显示高度(或宽度)定义为0,这样另外一部分通过链接跳转的时候就是在分帧内部跳转了,如果要跳出这个分帧,设置链接的target="_top"即可~~
    例子:
    <html>
    <head>
    <title>框架页</title>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    </head>

    <frameset rows="0,*" frameborder="NO" border="0" framespacing="0">
    <frame name="topFrame" scrolling="NO" noresize src="blank.htm" >
    <frame name="mainFrame" src="main.htm">
    </frameset>
    <noframes>
    <body bgcolor="#FFFFFF" text="#000000">
    对不起,你的浏览器不支持框架的显示。
    </body>
    </noframes>
    </html>

    Q: 绝对地址与相对地址?绝对定位与相对定位?
    A: 绝对地址:形如http://www.windstudio.net/index.htm 或file://d:/homepage/index.htm 这样的地址,就是文件在网络或本地的绝对位置;

    相对地址:就是被链接文件相对与当前页面的地址,比如说,链接和当前页面同级的文件地址只要用“文件名”即可;链接当前页面下级子目录下的文件用“目录名/文件名”;链接当前页面上一级目录下的文件用“../文件名”;链接同级但在另外一个子目录中的文件用“../目录名/文件名”;链接根目录(你的网站的根目录,并非硬盘根目录)下的文件可以用“./文件名”的形式。

    其实绝对和相对很容易理解的,相对就是有参照物的,绝对则是固定的。

    为什么我们提倡使用相对地址呢?打个比方说吧,如果你有一个index.htm,里面引用了images目录的一些图片,如果使用了相对地址,搬家的时候只需把原来这套东西全部上传到新的空间就行了,因为文件彼此之间的相对位置关系没有改变,所以这些地址仍然是有效的。但如果插入图片的时候使用了绝对地址,那空间地址一变,引用处的图片路径也要随之改变。当然,有时也会用到绝对地址,例如友情链接别人的主页等等。

    相对定位也是一样,如果是相对于一个单元格定位的层,单元格挪动到哪儿,层也就会到哪儿,结合这篇《关于层的相对于绝对定位》,就可以解决层很难适应多种分辨率的问题:
    http://www.windstudio.net/tech/show.asp?id=37

    用辩证的观点来看,其实绝对定位也是相对的,它和我们所说的相对定位的区别就在于,层的绝对定位是相对于浏览器的左边界和上边界而言,而层的相对定位是层相对于它的载体(表格或另外的层)而言~~

    Q: 如何取消链接的下划线?
    A: 用CSS来实现:
    <style type="text/css">
    <!--
    a:link { text-decoration: none}
    a:visited { text-decoration: none}
    a:hover { text-decoration: none}
    -->
    </style>
    其中a:link 表示一般的链接样式;a:visited 表示已访问过的链接样式;a:hover 表示鼠标经过时的链接样式。text-decoration: none 表示无下划线,text-decoration: underline 表示有下划线。

    如果三种链接状态的样式相同,也可以简化为:
    <style type="text/css">
    <!--
    a { text-decoration: none}
    -->
    </style>

    Q: 为什么在DW中把单元格高度设置为1没有效果?
    A: DW生成表格时会自动在每个单元格里填充一个&nbsp;代码,就是空格代码,如果有这个代码的存在,你把该单元格宽度或高度设置为1都没有效果,实际预览时该单元格会占据10px左右的宽度。
    如果把&nbsp;代码去掉,再把单元格宽度或高度设置为1,就可以在IE中看到预期的效果。但是在NS(Netscape)中该单元格不会显示,就好象表格中缺了一块。在单元格内放一个透明的GIF图,然后把它的宽度和高度都设置为1,这样就可以同时兼容IE和NS了。

    Q: 为什么在DW中给单元格设置了背景图有时在IE里看不到?
    A: 如果背景图的设置出现在<tr>里,在实际预览时是看不到效果的,我觉得这应该算做DW的一个BUG,手工把<tr>中的背景图相关设置代码转移到<td>中就好了。

    Q: 如何使表格背景色在鼠标经过时改变?
    A: <table width="100" border="0" cellspacing="1" cellpadding="0" bgcolor="#000000">
    <tr>
    <td onmouseover="style.backgroundColor='#CCCCCC'" onmouseout="style.backgroundColor='#FFFFFF'" align="center" bgcolor="#FFFFFF">背景色改变</td>
    </tr>
    </table>

    责任编辑: 平生一笑
    文章来源: 蔫老虎交流区

  • 相关阅读:
    SQL高级应用
    li元素之间产生间隔
    js array
    js高阶函数汇总
    git学习记录
    static和assets的区别
    router-link
    vue 创建项目 create和init
    vue的store状态管理模式
    vue中的各种属性
  • 原文地址:https://www.cnblogs.com/huqingyu/p/25817.html
Copyright © 2011-2022 走看看