<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>好看的按钮</title>
<style>
.btn {
BORDER-RIGHT: #7b9ebd 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7b9ebd 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#cecfde); BORDER-LEFT: #7b9ebd 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #7b9ebd 1px solid;
}
.btn1_mouseout {
BORDER-RIGHT: #7EBF4F 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7EBF4F 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#B3D997); BORDER-LEFT: #7EBF4F 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #7EBF4F 1px solid
}
.btn1_mouseover {
BORDER-RIGHT: #7EBF4F 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7EBF4F 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#CAE4B6); BORDER-LEFT: #7EBF4F 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #7EBF4F 1px solid
}
.btn2 {padding: 2 4 0 4;font-size:12px;height:23;background-color:#ece9d8;border-width:1;}
.btn3_mouseout {
BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #2C59AA 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #2C59AA 1px solid
}
.btn3_mouseover {
BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#D7E7FA); BORDER-LEFT: #2C59AA 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #2C59AA 1px solid
}
.btn3_mousedown
{
BORDER-RIGHT: #FFE400 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #FFE400 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #FFE400 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #FFE400 1px solid
}
.btn3_mouseup {
BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #2C59AA 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #2C59AA 1px solid;
}
.btn_2k3 {
BORDER-RIGHT: #002D96 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #002D96 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#FFFFFF, EndColorStr=#9DBCEA); BORDER-LEFT: #002D96 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #002D96 1px solid
}
</style>
</head>
<body>
<button class=btn> 好看的CSDN Button</button><Br />
<button class=btn1_mouseout onmouseover="this.className='btn1_mouseover'"onmouseout="this.className='btn1_mouseout'"> 好看的Green Button</button><Br />
<button class=btn1_mouseout onmouseover="this.className='btn1_mouseover'"onmouseout="this.className='btn1_mouseout'" DISABLED> 好看的Green Button</button><Br />
<button class=btn2> 好看的 e商2003 Button</button><Br />
<button class=btn3_mouseout onmouseover="this.className='btn3_mouseover'" onmouseout="this.className='btn3_mouseout'"onmousedown="this.className='btn3_mousedown'"
onmouseup="this.className='btn3_mouseup'"> 好看的QQ Button</button><Br />
<button class=btn_2k3> 好看的 2k3 Button</button>
</body>
</html>
分享到：
相关推荐
### 好看的按钮代码——网页编程 #### 概述 本文档提供了一系列美观的按钮样式代码，这些代码基于HTML与CSS实现。通过不同的样式设置，可以为网站设计增添更多的视觉吸引力。以下将详细介绍文档中提供的几种按钮...
本资源“50个CSS超炫丽button按钮样式代码”提供了多种创新且吸引人的按钮样式，旨在帮助开发者和设计师在他们的项目中创建出引人注目的用户界面。 1. CSS Button基础知识：在HTML中，`<button>`元素用于创建可点击...
在压缩包中的"codesc.net"可能是一个包含这些按钮实例的代码文件或者一个链接，用户可以通过查看或下载这个文件来学习和应用这些CSS3和HTML5按钮的设计技巧。这些实例对于前端开发者来说是宝贵的资源，他们可以参考...
总结来说，制作一个好看的CSS3网页3D按钮特效，需要熟练掌握和运用CSS3的3D转换、过渡效果、阴影、边框半径以及背景属性。通过精心调整这些属性，我们可以创建出具有高度交互性和视觉吸引力的网页元素，提升用户体验...
在给定的标题“多种好看的按钮”和描述“所上传的文件里面，有很多种LabVIEW的好看图标，直接复制使用”中，我们可以理解这个压缩包包含了一些设计精美的LabVIEW界面元素，特别是用于创建用户界面（UI）的按钮图标。...
话不多说，上运行效果图 在drawable文件夹下 新建button_drawable.xml <?xml version=1.0 encoding=utf-8 ?> <...--相当于做了一张圆角的图片,然后给button作为背景图片-->...corners and
标题中的“VC漂亮按钮源码帮助美化界面VS2005”揭示了这是一个关于使用Visual C++（简称VC）开发的源代码项目，其目的是为了美化Windows应用程序的用户界面，特别是通过实现圆角按钮来提升视觉效果。这个项目是专为...
这些代码可能包括动画效果、按钮、导航条、广告横幅等，它们能够为网站增添动态元素，提高用户的参与度。 在网页设计中，Flash代码通常基于ActionScript编写，这是一种面向对象的编程语言，用于控制Flash Player中...
标题“好看的WPF自定义按钮样式（绝对不亏）”提示我们，我们将学习如何创建一个吸引人的按钮样式，这将有助于提升应用的整体美感。描述中提到的预览地址虽然在此无法访问，但通常会展示一个动态的GIF图像，以直观地...
"好看的网页按钮，CSS圆角按钮"这个主题关注的就是如何利用CSS技术来创建既美观又吸引人的按钮。CSS，即层叠样式表（Cascading Style Sheets），是用于控制网页元素样式的一种语言，它赋予了网页设计师极大的灵活性...
3. **JavaScript**：如果需要动态效果，如滚动时固定底部或交互式按钮，JavaScript可以派上用场。它可以添加动态行为，如监听滚动事件，当用户接近页面底部时触发特定功能。 在"通用的网站炫酷底部美化代码"中，你...
总之，这个"好看的button样式"资源集涵盖了CSS在网页按钮设计中的广泛应用，无论你是新手还是资深开发者，都能从中获益。通过实践和探索这些代码，你可以打造出更具吸引力的用户界面，提升网站的整体品质。
5. **整合到项目中**：将编辑后的按钮导出为适合Web的格式（如PNG、SVG或CSS），然后在HTML/CSS代码中引用，或将它们嵌入到其他设计软件中，如Sketch或Figma。 这些按钮PSD素材对于初学者和经验丰富的设计师都极具...
"10个好看的css按钮源码.rar"是一个压缩包文件，包含了10个不同设计风格的CSS按钮源代码，旨在为开发者提供灵感和实用的代码示例，以便在自己的项目中创建美观且功能完备的按钮。 这些源码可能涵盖以下知识点： 1....
本资源提供了“Java好看又漂亮的界面风格的登录窗口源代码”，这将帮助开发者了解如何利用Java实现具有视觉吸引力的登录窗口。这篇文章将深入探讨Java GUI设计、组件使用以及可能涉及的设计原则。 首先，Java GUI...
在探讨“好看的文本框和按钮样式”的主题时，我们不仅关注功能性和实用性，还强调设计美学，以提升用户界面的吸引力。以下是从给定文件中提取的关键知识点，深入解析了如何通过HTML、CSS和JavaScript来创造既美观又...
本资源包含一个名为"简洁大气好看的网站弹窗代码"的压缩包，内含一份名为"网站弹窗代码.docx"的文档，提供了可以直接插入到任何网站中的弹窗代码。这份代码设计得既简洁又美观，适用于个人网站、企业网站或电子商务...
本文档通过具体的CSS代码示例，展示了如何设计美观且易于修改的按钮。通过定义不同状态下的样式，可以显著提升用户界面的互动性和吸引力。同时，使用CSS的`FILTER`属性实现了旧版本浏览器中的渐变效果，但在现代Web...
本资源包“一些好看的3D按钮”提供了一系列可供参考或使用的3D按钮设计，这些设计可以作为灵感来源，也可以直接应用于项目中，或者根据需求进行二次编辑和改进。 3D按钮的设计涉及到多个关键知识点： 1. **图形...
通过运用这些代码，您可以为您的企业官网或任何类型的网站增添一种现代、整洁且信息丰富的底部布局。 首先，HTML（HyperText Markup Language）是网页的基础结构，它定义了网页内容的各个部分。在这个底部美化代码...