Tag Archives: DIV

CSS定义HR和DIV成一条水平虚线

线条的CSS的两个样式: dotted :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为点线。否则为实线 dashed :  在MAC平台上IE4+与WINDOWS和UNIX平台上IE5.5+为虚线。否则为实线 水平线条,我们可以用hr来实现,也可以定义一个div,将它的高度设为1px或其它你想要的高度。 1、CSS定义一条水平虚线hr的方

Posted in Technology | Tagged , , , | Leave a comment

免费DIV+CSS视频教程下载

DIV+CSS当今WEB开发流行前台页面布局方式。 完整的代码演示,细致的讲解,高胖胖老师带你迅速掌握DIV+CSS应用技巧。 DIV+CSS视频教程(一)下载地址: http://www.phpchina.com/download/vido/div.css1/div.css1.rar DIV+CSS视频教程(二)下载地址: http://www.phpchina.com/download/vido/div.css2/div.css2.rar DIV+CSS视频教程(三)下载地址: http://www.phpchina.com/download/vido/div.css3/div.css3.rar DIV+CSS视频教程(四)下载地址: http://www.phpchina.com/download/vido/div.css4/div.css4.rar DIV+CSS视频教程(五)下载地址: http://www.phpchina.com/download/vido/div.css5/div.css5.rar 注意:视频资料来源于http://www.phpchina.com,只供大家学习交流之用,请勿用于商业用途! 在线观看DIV+CSS视频教程地址: 1、CSS基本概念 CSS初探 - CSS基本知识 - 第1课http://learning.artech.cn/uploads/2007/05/30/20070530.html CSS基本语法与核心概念 - CSS基本知识 - 第2课http://learning.artech.cn/uploads/2007/05/31/20070531.html 设置丰富的文字效果 - CSS基本知识 - 第3课http://learning.artech.cn/uploads/2007/06/01/20070601.html 2、CSS/DIV布局专题讲解 设置图片效果 - CSS/DIV专题讲解 - 第1课http://learning.artech.cn/uploads/2007/06/04/20070604.html 设置网页背景 - CSS/DIV布局专题讲解 - … Continue reading

Posted in Technology | Tagged , , | 2 Comments

JavaScript自动关闭的DIV公告框代码

实现效果: 使用JAVA和DIV组合让公告框在规定的时间内自动关闭。 完整代码内容如下: <div style="width:645px; margin:auto;" id="gdGonggaoBox01"> <div align="right"><a onclick="document.getElementById('gdGonggaoBox01').style.display='none';" href="#">关闭 </a></div> <div align="center"><strong>关于XXX调整的公告</strong></div> <div><p>     尊敬的XX客户:<br />        为使广大客户更容易了解自己的积分,方便参与XXX公司客户积分计划,XXX公司自即日起,对积分计划规则进行调整升级。...... <a href="http://429006.com/" target="_blank"><font color="#FF0000">【查看详情】</font></a> </p></div> </div> <script language="JavaScript" type="text/javascript"> function hidengonggao() { document.getElementById('gdGonggaoBox01').style.display='none' }; setTimeout(hidengonggao,30000); //setInterval("timer.innerText--;if(timer.innerText<='0')timer.innerText=='0';",1000); </script>

Posted in Technology | Tagged , , , | Leave a comment

SEO优化中的div&css命名规则

SEO(搜索引擎优化)对代码的优化是一个很关键的步骤。为了更加符合SEO的规范,下面中部IT网将对目前流行的CSS+DIV的命名规则整理如下: 页头:header 登录条:loginBar 标志:logo 侧栏:sideBar 广告:banner 导航:nav 子导航:subNav 菜单:menu 子菜单:subMenu 搜索:search 滚动:scroll 页面主体:main 内容:content 标签页:tab 文章列表:list 提示信息:msg 小技巧:tips 栏目标题:title 加入:joinus 指南:guild 服务:service 热点:hot 新闻:news 下载:download 注册:regsiter 状态:status 按钮:btn 投票:vote 合作伙伴:partner 友情链接:friendLink 页脚:footer 版权:copyRight 1.CSS ID 的命名 外 套:  wrap 主导航:  mainNav 子导航:  subnav 页 脚:  footer … Continue reading

Posted in Technology | Tagged , , , | Leave a comment

CSS定义某一DIV的链接字体颜色和大小

默认网页的连接文本是蓝色的,已访问的连接是紫色的。如果使用CSS的话就可以改变这些默认的定义,首先我们要知道这些代码如何的定义 a: link 用在为访问的连接上。 a :visited 用在已经访问过的连接上。 a :hover 用于鼠标光标置于其上的连接。 a :active 用于获得焦点(比如,被点击)的连接上。 如果给特定的DIV设定与其他DIV不一样的链接样式,就必须单独的定义 如: .tab { padding-left: 16px; font-size: 16px; font-weight: bold; } .tab a{ color: #000; } .tab active{ color:#000 } 或者是: #news{font-size:14px; color:#CC3300; margin-left:20px; line-height:22px;} #news a{font-size:14px; … Continue reading

Posted in Technology | Tagged , , | 1 Comment

DIV实现欺骗性的超链接

pop:主要是在文字上面放一个DIV的层的链接使状态栏显示层的链接,而没有显示文字的链接 效果:打开浏览器会有一个超级链接。把鼠标放上去会变成手型,状态栏也显示是www.baidu.com,但是如果点击,将会指向另外一个网站。 将下面的代码保存为保存为 *.html 代码: <div><a id="link" href="http://429006.com/" target="blank"></a></div> <div> <table><caption><label for="link"> <span style="text-decoration: underline;">www.baidu.com</span> </label> </caption> <tbody></tbody> </table> </div>

Posted in Technology | Tagged , | Leave a comment

隐藏如51la、cnzz、yahoo统计等的DIV框架图标的代码

pop:开始以为把宽和高设置成0就可以隐藏了,但是一测试发现不行,后来找到了一个代码就可以搞定了。不过希望大家还是把统计代码显示出来,毕竟免费用别人的,算是一个汇报别人了。 利用下面的这段代码可以隐藏如51la、cnzz、yahoo统计等的图标 代码1:<div style="display:none">这里放统计代码</div> 代码2:<div style="visibility:hidden">这里放统计代码</div> 完整代码演示: <!--51la开始--> <div style="visibility:hidden;"> <script language="javascript" type="text/javascript" src="http://js.users.51.la/1.js"></script> <noscript><a href="http://www.51.la/?1" target="_blank"><img alt="我要啦免费统计" src="http://img.users.51.la/1.asp" style="border:none"/></a> </noscript></div> <!--51la结束-->

Posted in Technology | Tagged , , , , , | 3 Comments