html 怎样设置按钮的位置？

html-css032

html 怎样设置按钮的位置？,第1张

设置按钮的父级元素为相对定位，设置按钮本身为绝对定位，利用定位控制按钮的位置！例如：

1、html的结构如下，设置按钮btn1和父级标签wrap

2、css样式如下：

.wrap设置为相对relative,  btn1设置为绝对absolute 以及控制他left的值和top的值

3、运行效果如下：

效果解读：

效果如下：

1、name : 表示按钮的名称，通常作为按钮标识进行使用。 <button name="btn">按钮</button>。

2、type : 表示按钮类型，通常与表单一起联用。reset : 重置按钮sumit : 提交按钮button : 普通按钮<button type="button">按钮</button>。

3、value : 表示按钮初始值，通常在js脚本中进行使用和修改。<button value ="点击">按钮</button>。

4、disabled ：表示禁用按钮，使按钮不能点击<button disabled ="disabled">按钮</button>。

html中设置按钮的位置:

解决方案一:

如果是绝对定位，可以设置left，还可通过margin,padding等；

" style="box-sizing: border-boxmargin: 0pxpadding: 0pxfont-family: Menlo, Monaco, Consolas, "Courier New", monospacecolor: rgb(51, 51, 51)font-size: 18.6773pxfont-style: normalfont-variant-ligatures: normalfont-variant-caps: normalfont-weight: normalletter-spacing: normalorphans: 2text-align: starttext-indent: 0pxtext-transform: nonewidows: 2word-spacing: 0px-webkit-text-stroke-width: 0pxbackground-color: rgb(255, 255, 255)"><td style="padding-right:30px"><input type="submit" value="注册"><input type="reset" value="重置"></td></tr>

解决方案二：

如果是绝对定位，可以设置left，还可通过margin,padding等。

参考资料

阿里云.阿里云[引用时间2018-1-9]