网站开发基础:HTML、CSS

前端开发主要使用的技术如 HTML、CSS 和 JavaScript 等。

简单制作一个网页

复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>柒毓同学网站的首页</title>
    <style>
        .c1{border: solid 1px green;width: 49%;height: 250px;float: left}
    </style>
</head>
<body>
    <h1>这是一级标题</h1>
    <h2>这是二级标题</h2>




</body>
</html>
复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>柒毓同学网站的首页</title>
    <style>
        .c1{border: solid 1px green;width: 49%;height: 250px;float: left}
    </style>
</head>
<body>
    <h1>这是一级标题</h1>
    <h2>这是二级标题</h2>

    <div style="border: solid 1px red;width: 100%;height: 300px">




</body>
</html>
复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>柒毓同学网站的首页</title>
    <style>
        .c1{border: solid 1px green;width: 49%;height: 250px;float: left}
    </style>
</head>
<body>
    <h1>这是一级标题</h1>
    <h2>这是二级标题</h2>

    <div style="border: solid 1px red;width: 100%;height: 300px">

        <div class="c1">
            <ol>
                <li>我是第一行</li>
                <li>我是第二行</li>
                
            </ol>
        </div>
        <div class="c1" style="float: right">
            <ul>
                <li>我是第一行</li>
                <li>我是第二行</li>
                
            </ul>
        </div>

    </div>



</body>
</html>
复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>柒小毓网站的首页</title>
    <style>
        .c1{border: solid 1px green;width: 49%;height: 250px;float: left}
    </style>
</head>
<body>
    <h1>这是一级标题</h1>
    <h2>这是二级标题</h2>

    <div style="border: solid 1px red;width: 100%;height: 300px">

        <div class="c1">
            <ol>
                <li>我是第一行</li>
                <li>我是第二行</li>
                <li>http://www.baidu.com</li>
                <li>liujingwei@cueb.edu.cn</li>
                <li>liu.jingwei@cueb.vip</li>
                <li>liu-jingwei@teacher.cueb-2019.vip</li>
                <li>liujingwei@cueb...vip</li>
            </ol>
        </div>
        <div class="c1" style="float: right">
            <ul>
                <li>我是第一行</li>
                <li>我是第二行</li>
                <li>http://www.baidu.com</li>
                <li>liujingwei@cueb.edu.cn</li>
                <li>liu.jingwei@cueb.vip</li>
                <li>liu-jingwei@teacher.cueb-2019.vip</li>
                <li>liujingwei@cueb...vip</li>
            </ul>
        </div>

    </div>


</body>
</html>
相关推荐
kyriewen12 小时前
微软用Go重写TypeScript编译器,速度提升10倍,网友:这是“背叛”还是“救赎”?
前端·typescript·ecmascript 6
Ceelog12 小时前
久坐党自救指南:屏幕前 8 小时,身体到底在经历什么
前端·后端
西陵12 小时前
Agent 为什么会陷入 Doom Loop?OpenClaw 的破解之道
前端·人工智能·ai编程
Hyyy13 小时前
普通前端续命周报——第2周
前端
wuxinyan12313 小时前
工业级大模型学习之路030:Streamlit 企业级智能体前端工作台
前端·学习·streamlit·智能体
修己xj13 小时前
告别无效刷屏!TrendRadar:最快30秒部署的开源热点助手,让你只看真正关心的新闻
前端
anOnion14 小时前
构建无障碍组件之Slider Pattern
前端·html·交互设计
云水一下14 小时前
JavaScript 从零基础到精通系列:前世今生与编程启蒙
前端·javascript
月亮邮递员61614 小时前
Markdown语法总结
开发语言·前端·javascript
Kurisu57514 小时前
雾锁王国修改器下载2026最新
前端·修改器代码