给按钮添加css样式的方法:
添加方法:
1、.btn {BORDER-RIGHT: #7b9ebd 1px solid右边线
2、PADDING-RIGHT: 2px内边距 右
3、BORDER-TOP: #7b9ebd 1px solid上边线
4、PADDING-LEFT: 2px内边距 左
5、FONT-SIZE: 12px文字大小
6、BORDER-LEFT: #7b9ebd 1px solid左边线
7、CURSOR: hand鼠标移上去时,变成手形。
8、COLOR: black颜色黑 (表示文字颜色)
9、PADDING-TOP: 2px内边距 上
10、BORDER-BOTTOM: #7b9ebd 1px solid }底边线
扩展资料
CSS样式部分
大小 {font-size: 12px},x-large(特大) xx-small(极小) 一般中文用不到,只要用数值就可以,单位:PX、PD
样式 {font-style: oblique}(偏斜体) italic(斜体) normal(正常)
行高 {line-height: normal}(正常) 单位:PX、PD、EM
粗细 {font-weight: bold}(粗体) lighter(细体) normal(正常)
变体 {font-variant: small-caps}(小型大写字母) normal(正常)
大小写 {text-transform: capitalize}(首字母大写) uppercase(大写) lowercase(小写) none(无)
修饰 {text-decoration: underline}(下划线) overline(上划线) line-through(删除线) blink(闪烁)
常用字体: (font-family)
"Courier New", Courier, monospace, "Times New Roman", Times, serif, Arial, Helvetica, sans-serif, Verdana
背景属性: (background)
色彩 {background-color: #FFFFFF}
图片 {background-image: url()}
重复 {background-repeat: no-repeat}
滚动 {background-attachment: fixed}(固定) scroll(滚动)
位置 {background-position: left}(水平) top(垂直)
字间距 {letter-spacing: normal} 数值 /*这个属性有用,多实践下*/
对齐 {text-align: justify}(两端对齐) left(左对齐) right(右对齐) center(居中)
1、首先创建一个txt文件,修改后缀名:把.txt改为.html,用记事本打开添加如下代码:打开浏览器,这是一个没有添加样式的button,外观不美观,而且在不同的浏览器下显示的外观是不一样的,所以我们要添加统一的样式。
2、按钮样式比较多,这样写让代码不整洁,可阅读性差,就要用style标签。
3、<style type="text/css"></style>样式表。style标签里面表示的是一个样式表,我们所有的样式都可以写到标签中去。这段代码的意思是:凡是button标签都使用这个样式。
4、把 样式表中的 button{}改成了.ui_button{},然后在button标签里面加了class属性,这样做的意思是,这个button标签使用了名字为ui_button的样式。
5、通过javascript动态修改样式,为了避免用户多次点击提交按钮重复提交信息,在用户点击提交按钮之后,禁用按钮,并设置按钮字体的颜色为灰色。
6、修改样式的其他方法:obj.style.cssText = "color:#E1E1E1background-color:black"cssText可以写多个样式样式属性。
7、修改样式的其他方法:obj.setAttribute("class", "style2")直接更改按钮标签的class属性,把指向名为ui_button的样式改为指向名为style2的样式。
8、修改样式的其他方法:<link href="css1.css" rel="stylesheet" type="text/css" id="css"/>obj.setAttribute("href","css2.css")修改引用外部的样式表文件,这样就可以对整个页面的样式进行全部更新。