|
|
@@ -0,0 +1,55 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="en">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <title>Document</title>
|
|
|
+ <style>
|
|
|
+ div {
|
|
|
+ width: 300px;
|
|
|
+ height: 300px;
|
|
|
+ /* 颜色 */
|
|
|
+ color:#f00;
|
|
|
+ /* 1.字体大小：16px 根字体
|
|
|
+ 浏览器可识别的最小字体 12px
|
|
|
+ font-size:数值px;
|
|
|
+ 2.字体粗细：font-weight
|
|
|
+ 粗: bold bolder 600-900
|
|
|
+ 正常:normal 400 500
|
|
|
+ 细:lighter 100-300
|
|
|
+ 3.字体样式：font-style
|
|
|
+ italic 倾斜
|
|
|
+ normal 正常
|
|
|
+ 4.字体:font-family
|
|
|
+
|
|
|
+ */
|
|
|
+ font-weight: 900;
|
|
|
+ font-size: 30px;
|
|
|
+ font-style: normal;
|
|
|
+ font-family: 'Courier New', Courier, monospace;
|
|
|
+ /* background: #ff0; */
|
|
|
+ background: rgb(0, 255, 0);
|
|
|
+ opacity: .3;
|
|
|
+ /* 透明
|
|
|
+ opacity <0-1> 对使用的盒子内的元素也具备效果
|
|
|
+ rgba 只对使用的盒子有效果
|
|
|
+ */
|
|
|
+ /* background: rgba(0, 255, 0, 1); */
|
|
|
+ }
|
|
|
+ /*
|
|
|
+ 16进制颜色 rgb rgba(alpha=>透明)<0-1>
|
|
|
+ #000000 黑色 #000 0,0,0
|
|
|
+ #ffffff 白色 #fff 255,255,255
|
|
|
+ #ff0000 红色 #f00 255,0,0
|
|
|
+ #00ff00 绿色 #0f0 0,255,0
|
|
|
+ #0000ff 蓝色 #00f 0,0,255
|
|
|
+ #ffff00 黄色 #ff0 255,255,0
|
|
|
+ */
|
|
|
+ </style>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+ <div>
|
|
|
+ 哈哈哈哈哈
|
|
|
+ </div>
|
|
|
+</body>
|
|
|
+</html>
|
e