1~13集笔记

前端基础主要就是三大件：HTML、CSS、JavaScript。

HTML：负责页面的结构和内容，相当于骨架。

CSS：负责页面的样式和布局。

JavaScript：负责页面的交互和逻辑。

注释:ctrl+/

向下复制：shift+alt+↓

删除一行：ctrl+shift+k

计算机对数据的操作：

存储时编码 读取时解码 都遵循字符集

html设置语言：

<html lang="zh-CN"> 简体中文

h标签无法嵌套

p标签是段落标签

div是块级标签

span行内标签

块级元素独占一行 其中能写行内与块级元素

行内元素 在一行 其中能写行内元素，不能写块级元素

em标签 着重阅读 斜体（emphasize）

strong标签 加粗

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> * { text-align: center; } body { margin: 0; padding: 30px; background-color: whitesmoke; color: black; font-family: "Microsoft YaHei", sans-serif; font-size: 18px; line-height: 1.8; } img{ height: 150px; width: 100px; } h2{ color: darkblue; } h3{ color: grey; } </style> <title>卡牌</title> </head> <body> <h2>梅花</h2> <h3>2~4</h3> <div> <span> <img src="./images/C2.png" alt="" > <img src="./images/C3.png" alt=""> <img src="./images/C4.png" alt=""> </span> </div> <h2>方片</h2> <h3>5~7</h3> <div> <span> <img src="./images/D5.png" alt="" > <img src="./images/D6.png" alt=""> <img src="./images/D7.png" alt=""> </span> </div> <h2>红桃</h2> <h3>8~10</h3> <div> <span> <img src="./images/H8.png" alt="" > <img src="./images/H9.png" alt="" > <img src="./images/H10.png" alt="" > </span> </div> <h2>黑桃</h2> <h3>j~k</h3> <div> <span> <img src="./images/SA.png" alt="" > <img src="./images/SJ.png" alt="" > <img src="./images/SQ.png" alt="" > <img src="./images/SK.png" alt="" > </span> </div> </body> </html>