HTML & CSS 极简入门.md
$
cat html & css 极简入门.md
HTML & CSS 极简入门
先了解 HTML 与 CSS
- HTML 是网页的结构:用标签定义标题、段落、按钮等内容。
- CSS 是网页的样式:控制颜色、字体、布局和动画。
它们是所有网页开发的起点,无需复杂工具,用浏览器即可查看效果。
学会它们,你就能创建自己的第一个网页!
精简代码:一个漂亮的居中卡片
<!DOCTYPE html>
<html>
<head>
<style>
body {
margin: 0;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
font-family: Arial, sans-serif;
background: #e3f2fd;
}
.card {
width: 300px;
padding: 30px;
background: white;
border-radius: 12px;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
text-align: center;
}
h2 {
color: #1976d2;
margin-bottom: 10px;
}
p {
color: #555;
font-size: 14px;
}
.btn {
display: inline-block;
padding: 8px 16px;
margin-top: 15px;
background: #1976d2;
color: white;
text-decoration: none;
border-radius: 4px;
}
</style>
</head>
<body>
<div class="card">
<h2>你好,世界!</h2>
<p>这是一个用 HTML 和 CSS 创建的简单卡片。</p>
<a href="#" class="btn">点击试试</a>
</div>
</body>
</html>