其实不仅仅是button,所有行内元素都存在这个问题(如span),这个问题的本质区别在于 block,inline和inlinke-block细节; block元素会独占一行,默认情况下,block元素宽度自动填满其父元素宽度; 2. inline元素不会独占一行,且设置width,height属性无效。另外,重点就是 inline元素的margin和padding属性,水平方向的padding, marg...
原理分析：缺少Doctype声明。7 IE8下input[button | submit] 设置margin:auto无法居中bug： 发生场合：ie8下，如果给像button这样的标签(如button input[type="button"] input[type="submit"])设置{ display: block; margin:0 auto; }如果不设置宽度的话无法居中。 解决方法：可以给为input加上宽度...
常用的内联块状元素有:<img> <input> <textarea> <select> <button> <caption> 1<caption>// 定义表格的标题2<img>// 向网页中嵌入一幅图像3<input>// 输入框4<textarea>// 多行的文本输入控件5<select>// 创建单选或多选菜单6<button>// 创建按钮 块状元素(也称块级元素,block) 块状元素特点: 每个...
首先,讲一下我在练习使用这两个属性时发现的问题如左: 1.我设计一个Button,分别用margin和padding进行控制,经过八大浏览器 调试,是同一个效果——纵向不起作用。 2.同样一个Button,value="邮箱"。同时用margin和padding进行控制:火 狐和opera同样效果;chrom和IE8效果一样,字体稍有偏差。 3.我写了这样一段代码...
functionplay(s){//参数s是一个buttonif(ani){//如果ani不为null,则代表我们当前已经有了一个动画clearInterval(ani);//所以我们需要清除它(停止动画)ani=null;s.innerHTML='Play';//重命名该按钮为“播放”}else{ani=setInterval(drawCanvas,40);//我们将设置动画为25fps,40/1000,即为二十五分之一s.inn...
最后在内联元素中还有上文我们提到的非可置换inline元素(non-replaced element),这些个元素img|input|select|textarea|button|label虽然是内联元素,但margin依旧可以影响到他的上下左右! 总结下来margin 属性可以应用于几乎所有的元素,除了表格显示类型(不包括 table-caption, table and in...
按钮button的水平垂直居中 .box{border:1px solid red;text-align:center;}.btn{padding:3px;/*除了可以设置上下padding相等,还可以设置heihgt=line-height(单行效果,或者明确只有一行)*/padidng:10px 0;display:inline-block;/*不设置的话背景色会露出父元素的边框,因为a连接是行内元素,设置padding对背景色有效...
其中有类特殊的元素:如img|input|select|textarea|button|label等,他们被称为可置换元素(Replaced element)。他们区别一般inline元素(相对而言,称non-replaced element)是:这些元素拥有内在尺寸(intrinsic dimensions),他们可以设置width/height属性。他们的性质同设置了display:inline-block的元素一致。
其中有类特殊的元素:如img|input|select|textarea|button|label等,他们被称为可置换元素(Replaced element)。他们区别一般inline元素(相对而言,称non-replaced element)是:这些元素拥有内在尺寸(intrinsic dimensions),他们可以设置width/height属性。他们的性质同设置了display:inline-block的元素一致。
代码:<input type="button" value="我是一个快乐的按钮" style="border:solid 1px black; padding-top:5px; background-color:#FF0000;coor=blue"> 二、margin 我们还是把一个HTML标记看成是一个盒子。既然padding是这个盒子里面的内容(或是数字汉字一类、或是图片),那么margin就是用来设置这个盒子和周围的盒...