仓酷云

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 692|回复: 8
打印 上一主题 下一主题

[DIV+CSS] 来谈谈:HTML和CSS做网页实例教程:用em制造倒三角提醒殊效

[复制链接]
若天明 该用户已被删除
跳转到指定楼层
楼主
发表于 2015-1-15 23:11:04 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
最新版本html5+CSS3与2014年10月29日,万维网联盟宣布,经过几乎8年的艰辛努力,该标准规范终于最终制定完成。
破洛洛文章简介:HTML和CSS做网页实例教程:用em制造倒三角提醒殊效.
本贴代码完成的是“用em完成倒三角的提醒效果”。

仅供老手参考进修,接待人人提出更多的完成办法。
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/>
<title>em完成倒三角的提醒效果</title>
</head>
<style>
#menu{width:500px;padding:0;margin:40pxauto;list-style-type:none;display:<spanhref="tag.php?name=tab"onclick="tagshow(event)"class="t_tag">tab</span>le;}
#menuli{width:100px;float:left;line-height:30px}
#menua{position:relative;display:block;text-decoration:none;background:#cccccc;width:100px;}
#menuaspan{display:block;font-weight:bold;color:#000;border-style:solid;border-width:0px2px2px0px;border-color:#fff#fff#06a#fff;text-align:center;}
#menuaem{display:none;}
#menua:hover{background:#FF0000;}
#menua:hoverspan{color:#fff;}
#menua:hoverem{display:block;overflow:hidden;border:6pxsolid#06a;border-color:#06a#fff;border-width:6px6px06px;position:absolute;left:50%;top:100%;margin-left:-6px;}
</style>
<body>
<ulid="menu">
<li><ahref="#"><span>MOne</span><em></em></a></li>
<li><ahref="#"><span>MTwo</span><em></em></a></li>
<li><ahref="#"><span>MThree</span><em></em></a></li>
<li><ahref="#"><span>MFour</span><em></em></a></li>
</ul>
</body>
</html>
</p>
你可以轻松地控制页面的布局。
沙发
发表于 2015-1-17 20:18:21 | 只看该作者
由CS4版本开始,则转用WebKit排版引擎(亦即GoogleChrome和AppleSafari浏览器所用的排版引擎)作为网页预览。
admin 该用户已被删除
板凳
发表于 2015-1-25 12:42:15 | 只看该作者
布局表格、绘制层、制作CSS样式表等,这些内容迷糊了我的视线,真是没想到制作一个精巧别致的网页是如此的困难,可是心有不甘。
若天明 该用户已被删除
地板
 楼主| 发表于 2015-2-2 22:15:07 来自手机 | 只看该作者
这个过程其实就是交流的过程。所有的这些都需要花时间。在面对完全陌生的软件时,就要多花时间对其产生初步的印象。此外,多操作也是非常重要的。
只想知道 该用户已被删除
5#
发表于 2015-2-8 14:10:08 | 只看该作者
Dreamweaver是集网页制作和管理网站于一身的所见即所得网页编辑器,在编辑时能同时看到源码和设计界面,非常方便新手学习制作网页。
再现理想 该用户已被删除
6#
发表于 2015-2-25 19:04:58 | 只看该作者
使用所见即所得的接口,亦有HTML编辑的功能。它现在有Mac和Windows系统的版本。原本由Macromedia公司所开发。
乐观 该用户已被删除
7#
发表于 2015-3-8 02:42:09 | 只看该作者
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH,专业网页图像设计软件FIREWORKS,并称为“网页三剑客”。
因胸联盟 该用户已被删除
8#
发表于 2015-3-15 21:53:13 | 只看该作者
在刚开始接触网页的第一堂课上,听说网页制作会是一门很无聊并且很难听懂的过程,而事实却印证了这样一个事实。
冷月葬花魂 该用户已被删除
9#
发表于 2015-3-22 06:03:47 | 只看该作者
使用所见即所得的接口,亦有HTML编辑的功能。它现在有Mac和Windows系统的版本。原本由Macromedia公司所开发。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|仓酷云 鄂ICP备14007578号-2

GMT+8, 2024-5-10 07:47

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表