<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>HTML文档</title>

    <style>

        body {

            margin: 0;

        }

        .clearfix:after {

            content: '';

            clear: both; /*左右两边都不能有浮动的元素*/

            display: block;

        }

        .left {

            width: 25%;

            height: 1000px;

            background-color: rgba(36,36,35,0.87);

            float: left;

        }

        .right {

            width: 75%;

            height: 1000px;

            /*background-color: aliceblue;*/

            background-color: rgba(128,126,126,0.18);

            float: left;

        }

        .head {

            width: 150px;

            height: 150px;

            border: 5px solid white;

            border-radius: 50%;

            margin: 20px auto;

            overflow: hidden;

        }

        .head img {

            max-width: 100%;

        }

        #name {

            width: 320px;

            text-align: center;

            font-size: 14px;

            color: rgba(180,188,195,0.52);

        }

        .msg {

            margin-top: 60px;

            width: 320px;

            text-align: center;

            font-size: 19px;

            color: rgba(180,188,195,0.52);

        }

        .content {

            background-color: white;

            height: 155px;

            width: 880px;

            margin: 10px 20px 10px 15px;

            padding: 0 10px;

            box-shadow:  10px 10px 5px #888888;

        }

        .content .title {

            font-size: 24px;

            border-left: red solid 3px;

            height:35px;

            margin-left: -10px;

            padding-top: 5px;

            padding-left: 10px;

        }

        .content span {

            float: right;

            font-size: 12px;

            margin-top: 5px;

            /*font-family: 隶书;*/

        }

        .content1 {

            padding-left: 10px;

        }

        .content2 {

            padding-left: 10px;

        }

    </style>

</head>

<body>

    <div class="left clearfix">

        <div class="head"><img src="头像.jpg" alt=""></div>

        <div id="name">

            <p>胖子布莱尼</p>

            <p>人生不如意十有八九 而你是一二。</p>

        </div>

        <div class="msg">

            <p>关于我</p>

            <p>微博</p>

            <p>微信公众号</p>

        </div>

        <div class="msg">

            <p># Python</p>

            <p># HTML</p>

            <p># MySQL</p>

        </div>

    </div>

    <div class="right clearfix">

        <div class="content">

            <p class="title">标题一<span>2019-11-14</span></p>

            <p class="content1">鹅鹅鹅,曲项向天歌,白毛浮绿水,红掌拨清波</p>

            <hr>

            <p class="content2"># Pyhton  # HTML</p>

        </div>

        <div class="content">

            <p class="title">标题一<span>2019-11-14</span></p>

            <p class="content1">鹅鹅鹅,曲项向天歌,白毛浮绿水,红掌拨清波</p>

            <hr>

            <p class="content2"># Pyhton  # HTML</p>

        </div>

        <div class="content">

            <p class="title">标题一<span>2019-11-14</span></p>

            <p class="content1">鹅鹅鹅,曲项向天歌,白毛浮绿水,红掌拨清波</p>

            <hr>

            <p class="content2"># Pyhton  # HTML</p>

        </div>

        <div class="content">

            <p class="title">标题一<span>2019-11-14</span></p>

            <p class="content1">鹅鹅鹅,曲项向天歌,白毛浮绿水,红掌拨清波</p>

            <hr>

            <p class="content2"># Pyhton  # HTML</p>

        </div>

        <div class="content">

            <p class="title">标题一<span>2019-11-14</span></p>

            <p class="content1">鹅鹅鹅,曲项向天歌,白毛浮绿水,红掌拨清波</p>

            <hr>

            <p class="content2"># Pyhton  # HTML</p>

        </div>

    </div>

</body>

</html>

1114作业 html的更多相关文章

  1. 作业成绩 final 20161124-1201 09:00

    final阶段,20161124-1201 09:00. 申诉截止时间 20161206 12:00,微信联系杨贵福. 凡描述需求或BUG时,应给出以下4项: 你期待看到的现象如何 你实际看到的现象 ...

  2. 第三次作业——K米评测

    第一部分 调研,评测 1.第一次上手体验 其实让我下载一个APP并且长期使用它是一件特别难的事情,不仅是因为占空间,需要注册个人信息,绑定账号,更是因为每款软件的功能虽然都很齐全,但是你并在没有真正用 ...

  3. BUAA软工个人作业Week3-案例分析

    一. 调研评测 评测项目:为了联系移动和PC版,我同时下载了必应词典的Android版本和UWP版本,选择UWP的原因是想看看微软推广的UWP在微软自己的应用上的效果.当然主要是对安卓的测评(UWP用 ...

  4. python10作业思路及源码：类Fabric主机管理程序开发（仅供参考）

    类Fabric主机管理程序开发 一,作业要求 1, 运行程序列出主机组或者主机列表(已完成) 2,选择指定主机或主机组(已完成) 3,选择主机或主机组传送文件(上传/下载)(已完成) 4,充分使用多线 ...

  5. SQLServer2005创建定时作业任务

    SQLServer定时作业任务:即数据库自动按照定时执行的作业任务,具有周期性不需要人工干预的特点 创建步骤:(使用最高权限的账户登录--sa) 一.启动SQL Server代理(SQL Server ...

  6. 使用T-SQL找出执行时间过长的作业

        有些时候,有些作业遇到问题执行时间过长,因此我写了一个脚本可以根据历史记录,找出执行时间过长的作业,在监控中就可以及时发现这些作业并尽早解决,代码如下:   SELECT sj.name , ...

  7. T-SQL检查停止的复制作业代理，并启动

        有时候搭建的复制在作业比较多的时候,会因为某些情况导致代理停止或出错,如果分发代理时间停止稍微过长可能导致复制延期,从而需要从新初始化复制,带来问题.因此我写了一个脚本定期检查处于停止状态的分 ...

  8. Python09作业思路及源码：高级FTP服务器开发（仅供参考）

    高级FTP服务器开发 一,作业要求 高级FTP服务器开发 用户加密认证(完成) 多用户同时登陆(完成) 每个用户有不同家目录且只能访问自己的家目录(完成) 对用户进行磁盘配额,不同用户配额可不同(完成 ...

  9. 个人作业week3——代码复审

    1.     软件工程师的成长 感想 看了这么多博客,收获颇丰.一方面是对大牛们的计算机之路有了一定的了解,另一方面还是态度最重要,或者说用不用功最重要.这些博客里好些都是九几年或者零几年就开始学习编 ...

随机推荐

  1. 面试常考各类排序算法总结.(c#)

    前言 面试以及考试过程中必会出现一道排序算法面试题,为了加深对排序算法的理解,在此我对各种排序算法做个总结归纳. 1.冒泡排序算法(BubbleSort) 1.1 算法描述 (1)比较相邻的元素.如果 ...

  2. markdown公式转为知乎格式

        在知乎中写技术类文章,经常会用到markdown知乎文章可以导入markdown格式,但是不支持Latex公式.知乎大神提供了替代方案: https://zhuanlan.zhihu.com/ ...

  3. 【DP合集】合并 union

    给出一个 1 ∼ N 的序列 A ( A 1 , A 2 , ..., A N ) .你每次可以将两个相邻的元素合并,合并后的元素权值即为 这两个元素的权值之和.求将 A 变为一个非降序列,最少需要多 ...

  4. LSTM神经网络走读

      0设计概述 RNN梯度爆炸和消失比较严重,RNN隐层只有一个状态h记录短期记忆,增加一个长期记忆状态c似乎就可以解决问题.

  5. 除法分块 luogu2261 (坑)

    除法分块 除法分块 是指使用分块计算的方法求S=∑i=1n⌊ki⌋S=\sum^{n}_{i=1}{\lfloor{\frac{k}{i}}\rfloor}S=i=1∑n​⌊ik​⌋的值. 举个例子. ...

  6. JVM 中发生内存溢出的 8 种原因及解决办法

    1. Java 堆空间 2. GC 开销超过限制 3. 请求的数组大小超过虚拟机限制 4. Perm gen 空间 5. Metaspace 6. 无法新建本机线程 7. 杀死进程或子进程 8. 发生 ...

  7. vue——前端跨域

    ***针对的是不同域名.不同协议的跨域: 1.找到config文件中开发环境的配置文件——dev.env.js,在里面将要跨域的域名配置进去 2.找到config文件中线上环境的配置文件——prod. ...

  8. windows 抓hash获取管理员密码

    webshell 找能执行权限的目录上传 C:\Windows\System32\config\sam 内有windows 密码 利用工具把密码抓出来 samcopy 直接抓取 GetHASHES.e ...

  9. 16.Linux yum扩展

    1.列出yum源可用的软件仓库 [root@yinwucheng ~]# yum repolist [root@yinwucheng ~]# yum repolist all 查看所有的仓库  ``` ...

  10. 在Spring Boot项目中使用Spock测试框架

    本文首发于个人网站:在Spring Boot项目中使用Spock测试框架 Spock框架是基于Groovy语言的测试框架,Groovy与Java具备良好的互操作性,因此可以在Spring Boot项目 ...