网站开发基础: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>
相关推荐
blackorbird10 分钟前
谷歌 Chrome 浏览器的指纹识别技术,一边反追踪一边搞追踪
前端·chrome
Mintopia40 分钟前
🚀 共绩算力:3分钟拥有自己的图像优化服务-CodeFormer:先进的图像算法优化、修复马赛克、提升图片清晰度等
前端·人工智能·ai编程
Lhuu(重开版1 小时前
html语法
前端·html
月弦笙音1 小时前
【vue3】这些不常用的API,却很实用
前端·vue.js·面试
小只笨笨狗~1 小时前
css-文字背景渐变色
前端·css·html
BingoGo1 小时前
CSS 也要支持 if 了 !!!CSS if() 函数来了!
前端·css
用户6600676685391 小时前
深入解析JavaScript数组:从内存原理到高效遍历实践
前端·javascript
用户12039112947261 小时前
CSS定位全解析:从静态到粘性,掌握元素布局的核心技巧
css
有点笨的蛋1 小时前
CSS 定位彻底搞懂:五种 position 的真实差异与最佳实践
前端·css