当前位置: 首页 > article >正文

网站开发基础: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>


http://www.kler.cn/news/330303.html

相关文章:

  • 四、网络层(下)
  • 《 Spring Boot实战:优雅构建责任链模式投诉处理业务》
  • 【Redis 源码】6AOF持久化
  • Linux_kernel字符设备驱动12
  • 云计算SLA响应时间的matlab模拟与仿真
  • Golang | Leetcode Golang题解之第446题等差数列划分II-子序列
  • C++学习笔记----8、掌握类与对象(二)---- 成员函数的更多知识(3)
  • 【数一线性代数】021入门
  • 代码工艺:Spring Boot 防御式编程实践
  • JavaScript Map全解:从基础到高级应用
  • jackson对于对象序列化的时候默认空值和手动传入的null的不同处理
  • 模拟斗地主发扑克的编程
  • Vue.js组件开发教程
  • JavaWeb——Vue组件库Element(3/6):常见组件:Dialog对话框、Form表单(介绍、使用、实际效果)
  • 新手教学系列——curl_cffi异步Session使用注意事项
  • AI生成垃圾内容对互联网的冲击与应对:一场持续扩展的危机
  • 嵌入式面试刷题(day18)
  • 在Ubuntu 16.04上使用LAMP安装WordPress
  • uniapp中uni.request的统一封装 (ts版)
  • PHP:构建高效Web应用的基石与实战案例