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")修改引用外部的样式表文件，这样就可以对整个页面的样式进行全部更新。
margin:50px 200px 200px 200px这样定义一个容器是错误的
因为BODY的大小你无法掌握，窗口的最大最小化你无法掌握，所以应该只设定两个方向的margin补丁
你这样的设置只能是让浏览器忽略其中的两个数值
一般div居中使用margin:0 auto，但是div不设定宽度无法居住，我给你一个建议好了，你可以在外层套一个table，因为table不设宽度的时候默认是宽度最小化的，设定margin:0 auto后table就可以根据内容的宽度自动伸展并且居中，因为是手打的，很多样式记不清全拼了，我就把主要样式写出来而已，记得把table的boder和外边距内边距都设为0；我因为工作不是做网页设计的，做的是软件开发，不过也差不了多少，因为界面绝大部分都需要宽度自适应，有时候需要居中的时候不能设定宽度就无法居中，所以我就会经常用到嵌套table的方式来达到居中效果，或者直接把ul列表直接改为table布局，这样更省事，table布局也不是一定就不好，table只是不适合大框架布局而已，部分小地方用一用还算蛮好用的，写代码不能太死板，要根据自己的需要适当的做调整
<table style="margin:0 auto">
<tr>
<td>
<div>1</div>
</td>
</tr>
</table>
<table style="margin:0 auto">
<tr>
<td>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</td>
</tr>
</table>
就这样吧，希望能帮到你；
注：其实你问的这个问题不算菜鸟问题，问的还算有水品的，哈哈
