1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>Document</title>
7
8 <!--
9 <style>
10 /* 元素选择器，通过标签名确定样式的作用元素 */
11 input{
12 height: 60px ;
13 width: 100px;
14 background-color: rgb(227, 136, 140) ;
15 color: azure ;
16 font-size: 20px ;
17 font-family: '隶书' ;
18 border: 3px ;
19 border-color: rgb(202, 189, 137) ;
20 border-radius: 5px;
21 }
22 </style>
23 -->
24
25 <link href="atCSS/01btn.css" rel="stylesheet">
26
27 </head>
28 <body>
29 <!--
30 引入方式
31 1 行内式
32 通过元素的style属性引入样式
33 语法：style="样式名:样式值;样式名:样式值;... ...;"
34 缺点：代码复用度低，不利于维护；css样式代码和html结构代码在一起，影响文件大小和性能
35 2 内嵌式
36 通过在head标签中的style标签定义本页面的公共样式
37 需要通过选择器来确定样式作用元素
38 3 外部样式表
39 将CSS代码单独放入一个.css文件中，哪个html需要这些代码，就在head中通过link标签引入
40 -->
41 <input type="button" value="按钮">
42 <input type="button" value="提交">
43 <!--
44 <input type="button" value="按钮"
45 style="
46 height: 60px ;
47 width: 100px;
48 background-color: hotpink ;
49 color: azure ;
50 font-size: 20px ;
51 font-family: '隶书' ;
52 border: 3px ;
53 border-color: chocolate ;
54 border-radius: 5px;">
55 -->
56 </body>
57 </html>
对应CSS文件
1 input{
2 height: 60px ;
3 width: 100px;
4 background-color: rgb(227, 136, 140) ;
5 color: azure ;
6 font-size: 20px ;
7 font-family: '隶书' ;
8 border: 3px ;
9 border-color: rgb(202, 189, 137) ;
10 border-radius: 5px;
11 }
标签：01,family,方式,color,100px,rgb,引入,font,border From： https://www.cnblogs.com/IrVolcano/p/18061159