1.样式不同
（1）readonly表示只读，一般表示对文字内容只读，即不可更改内容，使用时外观无变（2）disabled表示是残疾，是残废,不管什么内容都会无效；使用时文本框会变灰
2.有效范围不同
（1）readonly只针对input和textarea之类的可以输入的文本有效（2）disabled对所有的表单元素都有效
3.是否获取鼠标标点
（1）readonly为true用户不能编辑但光标可以聚焦（2）disabled为true光标不能聚焦也不可编辑，无鼠标点击或进入等事件
4.是否能够提交数据
（1）readonly不影响表单提交等问题（2）disabled不支持表单等的值被提交
需要准备的材料分别有：电脑、浏览器、html编辑器。
1、首先，打开html编辑器，新建html文件，例如：index.html。
2、在index.html中的<style>标签中，输入css代码：
button {border:0width: 200pxheight: 80pxbackground-color: gainsborocursor: not-allowed}
3、浏览器运行index.html页面，此时通过css实现了按钮的禁用样式。
根据测试结果disbled状态下文字颜色是可控的。示例代码如下：
<!DOCTYPE html><html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>测试页面</title>
</head>
<body>
<style type="text/css">
.test{color:red}
</style>
<input class="test" disabled="disabled" value="调整disaled内容样式">
</body>
</html>
代码最终执行效果如下图：
