当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 把网页按钮伪装成超链接

CSS样式表
css ID类和class类的长命名与短命名
CSS background-position的使用说明详解
利用CSS定位背景图片 background-position
CSS 多图片融合背景定位的应用于优缺点分析
CSS实现的图片宽高自适应固定边框
css 背景图片定位在菜单效果中的应用实例
CSS 速记口诀 可以解决一些常见问题
CSS 多浏览器兼容性问题及解决方案
css 行级元素在多浏览器下的宽度问题 与解决方法
IE下行框高度的问题
CSS 实现的图片宽高自适应固定边框
css的核心内容 标准流、盒子模型、浮动、定位等分析
CSS 超出隐藏实现限制字数的功能代码(多浏览器)
Div+CSS 布局入门教程之二 构建网站
CSS 网页布局中文排版的9则技巧
CSS网页布局25个实用小技巧
网页制作 默认Web字体样式
IE与Firefox的CSS兼容大全 推荐
css 非表格垂直对齐效果代码
css cursor 的可选值(鼠标的各种样式)

CSS样式表 中的 把网页按钮伪装成超链接


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 150 ::
收藏到网摘: n/a

今天看到一篇文章:Styling buttons to look like links,里面讲到一些东西挺实用,也确实需要开发者注意。比如,有些开发者就是会用 a 标签来做提交。比如有一个列表,每个列表后面都会有一个“删除”链接:

1
列表列表 <a href="/delete.php?id=xxx" title="">删除</a>

点击删除链接后就会带一个id或者其它参数到delete.php页面,delete.php中再去实现删除的逻辑。这样做有一个问题,就是它提交参数使用的是 GET 方法。根据HTML中的定义,GET方法一般是用来获取数据的,不会涉及到对后端数据的修改;而POST方法则可能包含对数据库的修改等操作,所以删除用链接实现不太好。有一种解决办法就是把 button 伪装成超链接的样子,然后在外面套上 form ,CSS 现在很强大,伪装一下不是很困难,可以参考这篇文章:Styling buttons to look like links 。另外,相对于用 input 实现按钮而言,button 更强大一点,建议多用 button 。

有时候设计师为了界面上的美观或者UI上的一致,会把一些元素设计成超链接的样子,然后web developer 拿过来图之后可能就“忠实”执行设计师的意图把那个地方做成了超链接,却忽略了一些功能上的考虑。这个就好像HTML标签语义化一样,虽然有些地方用 div 或者 span 看上去都一样,但是还是有区别的。以后做东西的时候我一定要多想想,不要被表面的东西迷惑了。