HTML標簽_增加css樣式
阿新 • • 發佈：2018-04-25
html spa height link ctype utf char meta ref
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 </head> 7 <body> 8 <!--第一種增加css樣式的方法，在標簽中增加style屬性--> 9 <div style="background-color: blue; width: 100px; height: 100px">我是第一塊</div><br> 10 <div style="background-color: red; width: 100px; height: 100px">我是第二塊</div><br> 11 </body> 12 </html>
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <style> 7 .c1{ 8 background-color: red; 9 width: 100px; 10 height:100px; 11 } 12 </style> 13 </head> 14 <body> 15 <!--第二種增加css樣式的方法，增加class屬性--> 16 <div class="c1">我是紅色</div><br> 17 </body> 18 </html>
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Title</title> 6 <!--第三種增加css樣式的方法，使用css文件--> 7 <link rel="stylesheet" href="c1.css"> 8 </head> 9 <body> 10 <div class="c1">我是粉色</div><br> 11 </body> 12 </html>
c1.css文件為
1 .c1{ 2 background-color: pink; 3 width: 100px; 4 height:100px; 5 }
HTML標簽_增加css樣式