本文介绍了添加CSS至&lt a取代;标签不工作的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我尝试添加CSS到一个按钮,但它只是输出作为一个纯超链接。结果
我是否需要使用<按钮和GT;
标记代替
< A HREF =example.com的风格=按钮{/ *书写正确,不相关的CSS * /吨}。>文字< / A>
解决方案
它应该是这样的 -
\r
\r\r
\r<标题=Subcribe现在的href =HTTP:// WWW ?.youtube.com /用户/ danielspringermusic sub_confirmation = 1的风格=文字修饰:无;文本对齐:中心;\r
填充:12px的6个像素;\r
边框:实心的3px#cc6300;\r
-webkit-边界半径:8像素;\r
-moz-边界半径:8像素;\r
边界半径:8像素;\r
字体:知识+宋体,日内瓦,无衬线;\r
字体重量:大胆的;\r
颜色:#000000;\r
背景:#c4302b;\r
-webkit-的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
-moz-的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
\r
文字阴影:0像素0像素为5px #bababa;\r
过滤:阴影效果(颜色=#BABABA,offx = 0,offy = 0); } .button:悬停{\r
填充:12px的6个像素;\r
边框:实心的3px#cc6300;\r
-webkit-边界半径:8像素;\r
-moz-边界半径:8像素;\r
边界半径:8像素;\r
字体:知识+宋体,日内瓦,无衬线;\r
字体重量:大胆的;\r
颜色:#000000;\r
背景颜色:#c42b3d;\r
背景图像:-moz线性梯度(顶,#c42b3d 0%,#2ba0c4 100%);\r
背景图像:-webkit线性梯度(顶,#c42b3d 0%,#2ba0c4 100%);\r
背景图像:-o-线性梯度(顶,#c42b3d 0%,#2ba0c4 100%);\r
背景图像:-ms线性梯度(顶,#c42b3d 0%,#2ba0c4 100%);\r
过滤:进程id:DXImageTransform.Microsoft.gradient(startColorstr ='#2ba0c4',endColorstr ='#2ba0c4',GradientType = 0);\r
背景图像:线性梯度(顶,#c42b3d 0%,#2ba0c4 100%);\r
-webkit-的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
-moz-的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
\r
文字阴影:0像素0像素为5px #bababa;\r
过滤:阴影效果(颜色=#BABABA,offx = 0,offy = 0);}按钮:活跃{\r
填充:12px的6个像素;\r
边框:实心的3px#cc6300;\r
-webkit-边界半径:8像素;\r
-moz-边界半径:8像素;\r
边界半径:8像素;\r
字体:知识+宋体,日内瓦,无衬线;\r
字体重量:大胆的;\r
颜色:#000000;\r
背景:#c4302b;\r
-webkit-的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
-moz-的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
的box-shadow:0像素0像素2px的#bababa,插图0像素0像素1px的#FFFFFF;\r
\r
文字阴影:0像素0像素为5px #bababa;\r
过滤:阴影效果(颜色=#BABABA,offx = 0,offy = 0);}>及认购LT; / A>
\r
I tried adding CSS to a button, but it just outputs as a plain hyperlink.
Do I need to use a <button>
tag instead?
<a href="example.com" style=".button { /*Tons of correctly written, irrelevant CSS */ }">text</a>
解决方案
Its should be like this -
<a title="Subcribe now" href="http://www.youtube.com/user/danielspringermusic?sub_confirmation=1" style="text-decoration:none; text-align:center;
padding:6px 12px;
border:solid 3px #cc6300;
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius: 8px;
font:17px Verdana, Geneva, sans-serif;
font-weight:bold;
color:#000000;
background:#c4302b;
-webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
-moz-box-shadow: 0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
text-shadow: 0px 0px 5px #bababa;
filter: dropshadow(color=#bababa, offx=0, offy=0); }.button:hover{
padding:6px 12px;
border:solid 3px #cc6300;
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius: 8px;
font:17px Verdana, Geneva, sans-serif;
font-weight:bold;
color:#000000;
background-color:#c42b3d;
background-image: -moz-linear-gradient(top, #c42b3d 0%, #2ba0c4 100%);
background-image: -webkit-linear-gradient(top, #c42b3d 0%, #2ba0c4 100%);
background-image: -o-linear-gradient(top, #c42b3d 0%, #2ba0c4 100%);
background-image: -ms-linear-gradient(top, #c42b3d 0% ,#2ba0c4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ba0c4', endColorstr='#2ba0c4',GradientType=0 );
background-image: linear-gradient(top, #c42b3d 0% ,#2ba0c4 100%);
-webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
-moz-box-shadow: 0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
text-shadow: 0px 0px 5px #bababa;
filter: dropshadow(color=#bababa, offx=0, offy=0);}.button:active{
padding:6px 12px;
border:solid 3px #cc6300;
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius: 8px;
font:17px Verdana, Geneva, sans-serif;
font-weight:bold;
color:#000000;
background:#c4302b;
-webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
-moz-box-shadow: 0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
text-shadow: 0px 0px 5px #bababa;
filter: dropshadow(color=#bababa, offx=0, offy=0);}">SubscribE</a>
这篇关于添加CSS至&lt a取代;标签不工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!