如何改变按钮样式

-4

的改变风格这种风格

我对按钮的CSS代码是

#login{ 
    border: 1px solid black; 
    width: 5%; 
    text-align: center; 
    margin-left: 1000px; 
}

来源

2017-03-15 pkarthicbz

好的......？添加一些圆角边缘，使其更小，更改字体，然后完成。这里有什么问题，如果不是“某人为我做这件事”？ – Santi

#login { border：1px solid black; 宽度：5％; text-align：center; \t \t padding：5px 15px; \t \t border-radius：3px; } – 2017-03-15 15:39:27

如果您知道一些CSS，它可以轻松实现。你在这里共享的CSS有点复杂，我想你项目样式表中设置的默认样式也会影响它。 –

#login{ 
 
    border: 1px solid black; 
 
    width: 5%; 
 
    text-align: center; 
 
\t \t padding: 5px 15px; 
 
\t \t border-radius: 3px; 
 
}

<div id="login">login</div>

来源

2017-03-15 15:40:03

该按钮看起来很大如何减小尺寸 – pkarthicbz

您可以将'padding：5px 15px'减少到'padding：3px 11px'等等。你也可以添加'font-size：11px'属性 – 2017-03-15 15:46:31

非常感谢你 – pkarthicbz

<div id="login">login</div> 

#login{ 
    display:inline-block; 
    border: 1px solid black; 
    text-align: center; 
    padding: 4px 15px; 
    border-radius: 3px; 
}

提琴手链接https://jsfiddle.net/wu7L8ct9/2/

来源

2017-03-15 15:49:31

这是更好地使用类选择应用样式的按钮

<button class="login-btn">Login</button>

而且你可以使用这个样式来获得想要的结果

.login-btn { 
    font-family: sans serif; 
    font-size: 13px; 
    background: transparent; 
    padding: 8px 20px; 
    border: 1px solid #000; 
    border-radius: 3px; 
}

尝试避免在你的btn风格中使用这个CSS属性 width: 5%; margin-left: 1000px; 必须为每个页面组件封装CSS样式

来源

2017-03-15 16:04:53

如何改变按钮样式

回答

相关问题