html与css综合2

作者：System 时间：2024年08月21日分类：所有,css 字数：1090

HTML和CSS的结合是网页设计的基础。以下是一个简单的HTML和CSS结合的例子，演示了如何创建一个带有背景颜色和文本的基本网页。




<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>示例网页</title>
    <style>
        body {
            background-color: #f0f0f0; /* 页面背景色 */
            margin: 0; /* 外边距 */
            font-family: Arial, sans-serif; /* 字体 */
        }
        .header {
            background-color: #333; /* 头部背景色 */
            color: white; /* 头部文本颜色 */
            padding: 10px; /* 内边距 */
            text-align: center; /* 文本居中 */
        }
        .content {
            margin: auto; /* 外边距居中 */
            width: 60%; /* 内容宽度 */
            padding: 20px; /* 内边距 */
        }
    </style>
</head>
<body>
 
<div class="header">
    我的网站
</div>
 
<div class="content">
    <h1>欢迎来到我的网页</h1>
    <p>这是一个简单的HTML和CSS结合的示例。</p>
</div>
 
</body>
</html>

这个例子展示了如何使用内部样式表（<style>标签）在HTML文档中添加CSS规则。.header和.content类被应用到两个<div>元素上，为页面的不同部分提供了视觉风格。这个简单的示例演示了如何将HTML内容与CSS样式结合起来，创建一个更加生动和专业的网页。

html与css综合2

评论已关闭

推荐阅读