毒逆天
毒逆天

08. Web大前端时代之：HTML5+CSS3入门系列 ~ QQ空间时间轴

Web大前端时代之：HTML5+CSS3入门系列：http://www.cnblogs.com/dunitian/p/5121725.html

 大前端系列，主要就是使用CSS3.0来实现，注释我已经打在代码里面了，直接看代码就可以了，后面会说一下CSS3.0系列，这个就当一个引入吧：

简单版本：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <style type="text/css">
        body {
            font-size: 100%;
            color: #7f8c97;
            font-family: '微软雅黑';
            background-color: #e9f0f5;
        }
        /*容器*/
        .paw-container {
            width: 90%;
            margin: 0 auto;
        }
        /*创建一条垂直线*/
        #paw-timeline {
            position: relative;
            padding: 2em 0;
            margin-top: 2em;
            margin-bottom: 2em;
        }

            #paw-timeline::before {
                content: '';
                position: absolute;
                top: 0;
                left: 50%;
                height: 100%;
                width: 4px;
                background: rgba(0,0,0,0.1);
            }
        /*循环小容器*/
        .paw-timeline-block {
            position: relative;
            margin: 3em 0;
        }

            .paw-timeline-block:first-child {
                margin-top: 0;
            }

            .paw-timeline-block:last-child {
                margin-bottom: 0;
            }
        /*轴上的图标*/
        .paw-timeline-icon {
            position: absolute;
            top: 0;
            left: 50%;
            width: 1em;
            height: 1em;
            margin-left: -0.5em;
            border-radius: 50%;
            background: white;
            box-shadow: 0 0 0 3px rgba(9, 229, 34,0.5), 0 0 0 3px rgb(255,255,255);
        }
            /*光晕*/
            .paw-timeline-icon:hover {
                box-shadow: 0 0 0 5px rgba(9, 229, 34,0.5), 0 0 0 3px rgb(255,255,255);
            }
        /*日期*/
        .paw-timeline-datetime {
            position: absolute;
            margin-left: -6em;
            margin-top: -2em;
            width: 7em;
            font-weight: bold;
        }
        /*内容*/
        .paw-timeline-content {
            width: 45%;
            margin-left: 0;
            padding: 1em;
            background: white;
            border-radius: 0.5em;
            box-shadow: 0 3px 0 #d7e4ed;
            overflow: hidden;
            /*不加这个小尖角容易有点问题*/
            position: relative;
        }
            /*第一个元素*/
            .paw-timeline-content:first-child {
                margin-top: 0;
            }
            /*最后一个元素*/
            .paw-timeline-content:last-child {
                margin-bottom: 0;
            }
            /*标题颜色*/
            .paw-timeline-content h3 {
                color: #303e49;
            }
            /*阅读更多 按钮*/
            .paw-timeline-content .paw-read-more {
                float: left;
                color: white;
                border-radius: 0.25em;
                padding: 0.7em 1em;
                background-color: #424242;
                text-decoration: none;
            }
                /*阅读更多 按钮特效*/
                .paw-timeline-content .paw-read-more:hover {
                    background: #acb7c0;
                }
        /*小尖角*/
        .paw-timeline-main::before {
            content: '';
            top: 16px;
            height: 0;
            width: 0;
            left: 100%;
            position: absolute;
            border-left: 7px solid white;
            border: 7px solid transparent;
        }
        /*偶数个设置新样式*/
        .paw-timeline-content:nth-child(2n) {
            float: right;
        }
        /*清除浮动*/
        .paw-timeline-content:nth-child(2n+1) {
            clear: both;
        }

        .paw-timeline-content:nth-child(2n) .paw-read-more {
            float: right;
        }
        /*小尖角反向*/
        .paw-timeline-content:nth-child(2n) .paw-timeline-main::before {
            content: '';
            left: auto;
            right: 100%;
            border: 7px solid transparent;
            border-right: 7px solid white;
        }
    </style>
</head>
<body>
    <section id="paw-timeline" class="paw-container">
        <header><h2>2016年</h2></header>
        <!--循环-->
        <div>
            <h3>03月</h3>
            <!--循环-->
            <div class="paw-timeline-block">
                <!--时间-->
                <div class="paw-timeline-icon">
                    <span class="paw-timeline-datetime">2016-03-17</span>
                </div>
                <!--循环内容-->
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
            </div>
            <div class="paw-timeline-block">
                <!--时间-->
                <div class="paw-timeline-icon">
                    <span class="paw-timeline-datetime">2016-03-16</span>
                </div>
                <!--循环内容-->
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
                <div class="paw-timeline-content">
                    <header class="paw-timeline-main">
                        <h3>标题</h3>
                        <p>内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。内容简介。。。</p>
                        <a href="#" class="paw-read-more" target="_blank">阅读全文</a>
                    </header>
                </div>
            </div>
        </div>
    </section>
</body>
</html>
View Code

多屏版本：

 

逆天版本：

 

你可能感兴趣的:(08. Web大前端时代之：HTML5+CSS3入门系列 ~ QQ空间时间轴)

  • 《昼颜》里的日本女人：相遇要万种风情，分手要残忍绝情 迷影咖啡
    作者：迷之菌子神奇菇迷影咖啡：一本正经做烘焙，胡说八道聊电影漫天萤火虫消散之时良宵就将过去，人们也说含苞待放的花蕾总会开了又谢，因紧紧相拥而面红耳赤的躯体，便是我们经历过这热爱的证明。夫妻关系介绍《昼颜》是2014年电视剧《昼颜：工作日下午三点的恋人们》的续集，故事发在电视剧情节结束的三年后，讲述了已经恢复独身的纱和偶然与曾经的出轨对象北野重逢后再次陷入感情漩涡的故事。《昼颜》制作灵感源自利佳子在
  • 迎接2019 唯有杜康1994
    告别2018这一年是机遇与挑战，痛苦与喜悦，失去与收获的一年一月:收获了第一份爱情，开始真正想去了解一个人三月:对工作有了更深入的认识，靠自己的力量完成晋升五月:搬家，住进了自己理想的公寓，一间属于自己的屋子。满地的书六月:外调广州，升经理，有了自己的第一个团队。七月:怀着自我否定，第一次完成了部门任务八月:第一个员工流失，痛哭不已明白无不散之筵席九月:员工陆续离开，经济是一切的根本。十月:陪员工
  • 亲子日记之祝姑姥姥生日快乐（282） 冰心雨露_d504
    2021年7月18日，周日，晴周日上班的不上班，上学的不上学，全家都属于休息状态，洗衣做饭是上午的主要任务，中午休息一会儿，下午比较晚了出去给梦怡买了二年级上册的口算题卡，然后去参加姑姑的生日聚餐，本来姑姑应该是周一生日，因为周一都要上班，就提前到周日过了，说是过生日其实就是想借此机会一家人聚聚，毕竟平常都忙，没有时间聚在一起，梦怡还给姑姥姥做了生日贺卡，虽然长相一般，重在心意。生日快乐
  • android 自定义曲线图,Android自定义View——贝赛尔曲线 weixin_39767513 android自定义曲线图
    个人博客：haichenyi.com。感谢关注本文针对有一定自定义View的童鞋，最好对贝赛尔曲线有辣么一丢丢了解，不了解也没关系。花5分钟看一下GcsSloop的安卓自定义View进阶-Path之贝塞尔曲线。本文的最终效果图：最终效果图.gif思路首先他是一个只有上半部分的正弦形状的水波纹，很规则。其次，他这个正弦图左右在移动。然后，就是它这个自定义View，上下也在移动，是慢慢增加的最后，优化
  • 信任 饮冰伊乔
    随着社会的发展，微信和支付宝交易给人们带来了极大的方便，越来越多的人出门都只选择拿一部手机即可，方便安全，可昨天我就遇到了一件比较尴尬的事。昨天傍晚，我从公司出来，感觉有点饿，决定索性吃了饭再回去，来到去过几次的一个店里，如往常一样叫了餐，当时店里吃饭的不多，老板麻利的先去做了，正要扫微信付账的时候发现手机没电了，迷之尴尬，我只好跟老板说不用做了，手机没电了，我身上又没现金，付不了帐了。老板娘很热
  • 数据分析：低代码平台助力大数据时代的飞跃发展 快乐非自愿 数据分析低代码大数据
    随着信息技术的突飞猛进，我们身处于一个数据量空前增长的时代——大数据时代。在这个时代背景下，数据分析已经成为企业决策、政策制定、科学研究等众多领域不可或缺的重要工具。然而，面对海量的数据和日益复杂多变的分析需求，传统的数据分析方法往往捉襟见肘，难以应对。幸运的是，低代码平台的兴起为大数据分析注入了新的活力，成为推动大数据时代发展的重要力量。低代码平台，顾名思义，是一种通过少量甚至无需编写代码，就能
  • Django之Debug篇 菜鸟之编程 Djangodjangopython后端
    一、DebugToolBar基本使用1.1、概述Django框架的调试工具栏使用django-debug-toolbar库，是一组可配置的面板，显示有关当前请求/响应的各种调试信息，点击时，显示有关面板内容的更多详细信息。官方文档：DjangoDebugToolbar—DjangoDebugToolbar4.3.0documentation1.2、安装pipinstalldjango-debug-
  • 以高质量调查研究助力组织工作提质增效 木同木同
    近日，中共中央办公厅印发了《关于在全党大兴调查研究的工作方案》(后简称《方案》），要求各地区各部门结合实际认真贯彻落实。调查研究是我们党的传家宝，是谋事之基、成事之道。组织部门作为党管干部的核心部门，肩负着管党员、管干部、管人才的重要职责，调查研究更是把握组织工作规律、破解组织工作难题的重要办法。要用好调查研究这一法宝，把准政治方向，贯穿问题导向，坚持实事求是，以高质量调查研究助力组织工作提质增效
  • 地低为海人低为王 缘梦草
    地低为海，人低为王。低，高之基，高，低之顶。谦虚才能收益，咄咄逼人会招损。高粱熟了，头会低下。受益反而会深藏不露。捧人之术，把人捧高，然后控制。受控之人，大都是虚荣心作祟。活成别人想象中的样子，像别人想象中那么有面子的活着是悲哀的。穷不可怕，怕的是虚荣心。当你好面子，你就会被控制。一旦受虚荣心控制，你不得不谨小慎微的维护面子，付出多余的能量，希望得到别人的一句赞。面子就是金子打造的牢笼，让你在赞美
  • 子非鱼，焉知鱼之乐 零启若
    在如今网络爆飞信息发达的时代，我们会在各种论坛以及平台看到不计其数的评论，有一些人在评论的时候总是以高尚的道德为标准和底线去衡量，评判，甚至谩骂他人。并且觉得自己充满正义感，义正辞严。这些人姑且不说有没有考虑到别人的感受，更没有感同身受的体验，只是凭借着言论自由，甚至是一种猥琐和变相的心理发泄。就像人和动物一样，人类总是以高等动物自居，高高在上，并且认为人类吃食各种动物都是理所当然，动物就是给人吃
  • 计划比盲目做重要 一祉微笑
    坚持分享第99天。一次次会议提醒着老师们假期余额不足，马上面临停机状态。50多天掐指而过，想想放假时的计划，对照如今的完成情况，感觉差太远。想着好好看书，如今50多天过去了第6本还处在未完待续状态；想着假期好好陪陪孩子，在玩中学一些知识，如今想想，孩子学的真不多；想着暑假坚持跑步，有时还是容易给自己找借口，休息三两天。给这个假期一个综合评价，只能说只完成了计划的百分之五六十。想想为什么临近开学没达
  • 081天 约柜失而复得 宁宁2018
    撒迦利亚书4:6他对我说：“这是耶和华指示所罗巴伯的。万军之耶和华说：‘不是倚靠势力，不是倚靠才能，乃是倚靠我的灵方能成事。’
  • 《金文成〈正蒙〉日记124。2020-11-9》 金吾生
    《金文成〈正蒙〉日记124。2020-11-9》今天是庚子丁亥丙子，九月廿四，2020年11月9日星期一。作者篇7【舜之孝，汤、武之武，虽顺逆不同，其为不幸均矣。】船山讲解说，顺，指的是舜的父亲最终受到感化，转变了态度，结局圆满之事；逆，指的是＂桀放、纣诛＂，即，商汤放桀，周武诛纣，都是采用暴力，不是感化方式，所以是逆。顺与逆，都是为了解决弊政，然其差异之大如此，然而，无论圆满还是遗憾，其实他们都
  • 如何把大象装进冰箱的思考 210624 大丁_初心生活
    央视春晚曾有个小品，宋丹丹问赵本山，如何把大象装进冰箱。赵本山说不知道。宋丹丹得意地说，第一步，把冰箱门打开。第二步，把大象装进去。第三步，把冰箱门关上。我相信很多人看了都是一笑了之，我们也从潜意识上给出了否定的答案。樊登老师给出了不一样的解读，他认为这其实是解决问题的经典方法。“把大象装冰箱”，目标十分明确，宋丹丹给出的执行步骤也十分清晰。可赵本山却不会？难道赵本山不知道这三个步骤吗？肯定知道。
  • 791 | 以待流年：懂得是生命中最厚重的底色。【2020.10.22】 邓越_越越安
    图、文/越享生活馆Part1关键词：懂得、得体、大方在知乎上看到过一句话：即使你躺倒让别人踩在你身上走，别人还是会抱怨你踩着不够舒服。的确如此，大千世界，众口难调。你不可能让所有人喜欢你。所以，不用试图让所有人开心，不用为别人的目光所累，过好自己的生活吧。不懂你的人，即使你再小心翼翼，一再讨巧，也无法交心、长存。而懂你的人，即使距离遥远，也会因为内心深处的相知，彼此相惜。就像魏晋时代的竹林七贤中，
  • 遗落的光阴 古诗风光
    第七篇，小明的学生时代。小明和他的同桌的共听一首歌的行为已经实现了。所以每次没事就和他的同桌一起畅听音乐，这也导致了一些场面都发生，一就是她的隔壁同桌时不时的鄙夷的眼光，二是他进一步加聚了他同桌对他的态度，他的同桌除了平时的听音乐交流之外，还增加了与他的交流。其中最关键的就是，因为他的同桌没事就与他的进行生活的交流。其中最关键的就是在一个不上课的周末小明独自一人回到了宿舍进行学习。而这时他的同桌带
  • 道德经第三十四章 套马地汉纸
    道德经第三十四章原文：大道泛兮，其可左右！万物恃之而生，而不辞，功成不名有。爱养万物而不为主，常无欲，可名于小；万物归焉而不为主，可名为大。是以圣人终不为大，故能成其大。译文：大道广泛流行，无所不到。万物依赖它生长而不推辞，有所成就而不自以为有功。养育万物而不自以为主，永远没有私欲，可以说是渺小得很，所以可称它为“小”；物归附于它而它不自以为主宰，可以说极其伟大，所以可称它为“大”。由于它不自以为
  • 第三章 一张纸条 我是凉皮
    大学的生活从刚开始的陌生无助慢慢变得熟悉。没有了高中时代学业繁重的压力和各种束缚。现在的生活相比来说，更感觉像是天堂，只是这里的天堂会有些时候变得找不到方向，开始变得迷茫。陈铭还是三点一线生活，教室，食堂，宿舍。虽然，上课时，陈铭也会经常对着那个身影发呆。可是，两个人并没有任何的交流。不过，晚上睡觉时可以和程真聊天，每天聊的也都是有的没的，但陈铭感觉那也是一种乐趣。时间久了，通过文字，两个人都有了
  • Linux学习系列之vim编辑器（一） llibertyll linux学习
    vi编辑器的操作模式输入模式—aio等—>命令模式<—：键—末行模式从输入/末行模式切换到命令模式都是需要按ESC键注:a光标后输入，i光标前输入，o直接向下加一行输入，O向上加一行输入在vi编辑器中光标的移动（命令行模式下）键组合（命令）光标的移动$光标移动到当前行的结尾0（零）光标移动到当前行的开始GG光标移动到最后一行gg光标移动到第一行在命令行模式下删除与复制的操作键组合（命令）含义dd删
  • 6/21 最后的编织之观后感 ChereAlicia
    今天看了7分钟震撼人心之短篇有种当局者迷旁观者清的感觉在外人眼里看来已经足够但自有人深陷其中无法自拔而那个人很有可能是自己超脱物质寻求自己真正想要的方能得到内心的平息和安宁图片发自App
  • 每天学点成语 余子烨
    1、口诀：功败垂成未成功，不以为然不赞同；火中取栗被利用，罚不当罪处罚重；2、解释：功败垂成：事情接近成功的时候却遭到了失败。出自：《三国志·杨阜传》：“弃垂成之功，陷不义之名，阜以死守之。”不以为然：不认为是对的。表示不同意或否定。出自：宋·苏轼《再乞罢详定役法状》：“右臣先曾奏论前衙一役，只当招募，不当定差，执政不以为然。”火中取栗：一只猴子和一只猫看见炉火中烤着栗子，猴子叫猫去偷，猫用爪子从
  • 2023-11-07 碎碎念念的每一天
    忽然开始自卑了，感觉自己无论各个方面都太平平，读书不多，家务做不好，体重控制的不好，早起也困难，起来又不知道该做什么，没有一个可以为之奋斗的目标，也没有很好的交际圈，感觉自己就像一只在笼子里的鸟，想飞也飞不高……我想改变这样的现状，可该如何呢？其实都是我不够努力，没有争分夺秒，没有自律，这些都是我未来跟人拉开差距的原因，所以，我不应该只是自卑，自卑过头会变成焦虑，我应该努力去改变，哪怕改变一小点，
  • 西安 专业nft开发NFT寄售-NFT抢购-NFT盲盒-NFT空投 电报dapp119 区块链软件开发区块链
    在数字化时代的今天，非同质化代币（NFT）正成为数字资产领域的新宠。作为区块链技术的一种应用，NFT赋予数字资产独一无二的身份和价值，从而在艺术、游戏、音乐、收藏品等领域掀起了一股热潮。西安，这座千年古城，也融入了这股数字化潮流，拥有专业的NFT开发公司，为个人和企业提供多种NFT相关服务，其中包括NFT寄售、NFT抢购、NFT盲盒和NFT空投。NFT寄售NFT寄售是一种常见的NFT交易方式，通过
  • stm32之GPIO寄存器 luofengmacheng 嵌入式stm32嵌入式硬件单片机
    文章目录1背景2GPIO寄存器的类型2.1端口配置寄存器2.2设置/清除寄存器和位清除寄存器3总结1背景C51单片机在进行数据的输入输出时，是直接操作与外部引脚关联的内部寄存器，例如，当设置P2_1为0时，就是将外部引脚的P21引脚设置为低电平，当读取P2_1时，就是读取P21的电平。与之类似，stm32芯片内部也有很多用于输入输出的寄存器，这些寄存器也是用于操作外部引脚，但是比C51单片机复杂很
  • 《老子》笔记19 2018-10-28 海上明月共
    第二十二章[原文]曲则全，枉则直，洼则盈，敝则新，少则得，多则惑。是以圣人抱一为天下式。不自见，故明；不自是，故彰，不自伐，故有功；不自矜，故长。夫唯不争，故天下莫能与之争。古之所谓"曲则全"者，岂虚言哉？诚全而归之。[译文]委曲便会保全，屈枉便会直伸；低洼便会充盈，陈旧便会更新；少取便会获得，贪多便会迷惑。所以有道的人坚守这一原则作为天下事理的范式，不自我表扬，反能显明；不自以为是，反能是非彰明
  • 爱心账户之存钱日记11.20 静_d595
    新沙发终于到了，满心欢喜，可旧沙发的处理又是个头疼的问题，免费送都没有人要。临时想起来公司那个收垃圾的，看看付费能不能拉走。对方说随便给点都行，我又拿不准，于是就想说88把。对方说给两包烟就行了，我说还是给钱吧，也不想欠人情。如果请专门搬东西的估计得200加了，还算是比较顺利，刚好想到他。选了12元存进我的爱心账户！
  • 《红太阳幼儿园》剧本杀复盘/凶手/剧透/真相/答案/攻略 VX搜_小燕子复盘
    为了你获得更好的游戏体验，本文仅显示《红太阳幼儿园》剧本杀部分真相复盘，获取完整真相复盘只需两步①【微信关注公众号：集美复盘】②回复【红太阳幼儿园】即可查看获取哦﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎﹎1、剧本杀《红太阳幼儿园》角色介绍【宋晓晓】女，28岁，上市公司的董事长，独立果敢，执着认真，有着新时代女性独有的风采。【林缘】女，27岁，温柔秀气的女孩，十
  • 2024中国消费者健康数字创新峰会 上海希为 健康医疗
    2024中国消费者健康数字创新峰会会议时间：2024年5月21-22日会议地点：中国·上海主办方：ECVInternational（本次会议线上线下同步举行）一、会议背景随着健康中国2030战略规划不断推进，消费者健康市场发展也日趋强劲，体现出健康消费意识提前，自我健康管理意识增强的局面。后疫情时代下，消费者健康市场呈现出卓越的韧性与活力。本次峰会将汇集医疗大健康领域专家、企业领袖、零售连锁药店专
  • 数据库的魅力：深入探索与应用 小黄编程快乐屋 数据库
    数据库的魅力：深入探索与应用在数字化时代，数据库已经成为信息处理和存储的基石。无论是大型企业还是个人开发者，数据库都是不可或缺的工具。本文将带您深入探索数据库的魅力，了解其基本概念、类型以及应用，并分享一些实用的数据库管理技巧。一、数据库的基本概念数据库，简而言之，就是按照一定规则存储、组织和管理数据的仓库。它可以看作是一个电子化的文件柜，用于存储电子化的文件。这些文件按照特定的数据模型组织起来，
  • 大话设计模式之工厂模式 码农客栈 设计模式开发语言
    工厂模式（FactoryPattern）是一种创建型设计模式，它提供了一种创建对象的最佳方式，而无需指定将要创建的对象的确切类。通过使用工厂模式，我们可以将对象的创建和使用分离，从而使代码更具灵活性和可维护性。在工厂模式中，通常会有三种角色：工厂接口（FactoryInterface）：声明了一个用于创建对象的接口，这样所有具体工厂类都必须实现该接口。具体工厂（ConcreteFactory）：实
  • 继之前的线程循环加到窗口中运行 3213213333332132 javathreadJFrameJPanel
    之前写了有关java线程的循环执行和结束，因为想制作成exe文件，想把执行的效果加到窗口上，所以就结合了JFrame和JPanel写了这个程序，这里直接贴出代码，在窗口上运行的效果下面有附图。 package thread; import java.awt.Graphics; import java.text.SimpleDateFormat; import java.util
  • linux 常用命令 BlueSkator linux命令
    1.grep 相信这个命令可以说是大家最常用的命令之一了。尤其是查询生产环境的日志，这个命令绝对是必不可少的。 但之前总是习惯于使用 （grep -n 关键字 文件名 ）查出关键字以及该关键字所在的行数，然后再用 （sed -n  '100,200p' 文件名），去查出该关键字之后的日志内容。 但其实还有更简便的办法，就是用（grep  -B n、-A n、-C n 关键
  • php heredoc原文档和nowdoc语法 dcj3sjt126com PHPheredocnowdoc
    <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>Current To-Do List</title> </head> <body> <?
  • overflow的属性 周华华 JavaScript
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&q
  • 《我所了解的Java》——总体目录 g21121 java
            准备用一年左右时间写一个系列的文章《我所了解的Java》，目录及内容会不断完善及调整。         在编写相关内容时难免出现笔误、代码无法执行、名词理解错误等，请大家及时指出，我会第一时间更正。    &n
  • [简单]docx4j常用方法小结 53873039oycg docx
            本代码基于docx4j-3.2.0，在office word 2007上测试通过。代码如下:         import java.io.File; import java.io.FileInputStream; import ja
  • Spring配置学习 云端月影 spring配置
    首先来看一个标准的Spring配置文件 applicationContext.xml <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi=&q
  • Java新手入门的30个基本概念三 aijuans java新手java 入门
    17.Java中的每一个类都是从Object类扩展而来的。　　18.object类中的equal和toString方法。　　equal用于测试一个对象是否同另一个对象相等。　　toString返回一个代表该对象的字符串,几乎每一个类都会重载该方法,以便返回当前状态的正确表示.(toString 方法是一个很重要的方法)　　 19.通用编程:任何类类型的所有值都可以同object类性的变量来代替。　
  • 《2008 IBM Rational 软件开发高峰论坛会议》小记 antonyup_2006 软件测试敏捷开发项目管理IBM活动
    我一直想写些总结,用于交流和备忘,然都没提笔,今以一篇参加活动的感受小记开个头,呵呵! 其实参加《2008 IBM Rational 软件开发高峰论坛会议》是9月4号,那天刚好调休.但接着项目颇为忙,所以今天在中秋佳节的假期里整理了下. 参加这次活动是一个朋友给的一个邀请书,才知道有这样的一个活动,虽然现在项目暂时没用到IBM的解决方案,但觉的参与这样一个活动可以拓宽下视野和相关知识.
  • PL/SQL的过程编程,异常,声明变量,PL/SQL块 百合不是茶 PL/SQL的过程编程异常PL/SQL块声明变量
    PL/SQL;    过程; 符号; 变量; PL/SQL块; 输出; 异常;     PL/SQL 是过程语言(Procedural Language)与结构化查询语言(SQL)结合而成的编程语言PL/SQL 是对 SQL 的扩展,sql的执行时每次都要写操作
  • Mockito(三)--完整功能介绍 bijian1013 持续集成mockito单元测试
            mockito官网：http://code.google.com/p/mockito/，打开documentation可以看到官方最新的文档资料。 一.使用mockito验证行为 //首先要import Mockito import static org.mockito.Mockito.*; //mo
  • 精通Oracle10编程SQL(8)使用复合数据类型 bijian1013 oracle数据库plsql
    /* *使用复合数据类型 */ --PL/SQL记录 --定义PL/SQL记录 --自定义PL/SQL记录 DECLARE TYPE emp_record_type IS RECORD( name emp.ename%TYPE, salary emp.sal%TYPE, dno emp.deptno%TYPE ); emp_
  • 【Linux常用命令一】grep命令 bit1129 Linux常用命令
    grep命令格式   grep [option] pattern [file-list]     grep命令用于在指定的文件(一个或者多个,file-list)中查找包含模式串(pattern)的行,[option]用于控制grep命令的查找方式。   pattern可以是普通字符串，也可以是正则表达式，当查找的字符串包含正则表达式字符或者特
  • mybatis3入门学习笔记 白糖_ sqlibatisqqjdbc配置管理
    MyBatis 的前身就是iBatis，是一个数据持久层(ORM)框架。  MyBatis 是支持普通 SQL 查询，存储过程和高级映射的优秀持久层框架。MyBatis对JDBC进行了一次很浅的封装。   以前也学过iBatis，因为MyBatis是iBatis的升级版本，最初以为改动应该不大，实际结果是MyBatis对配置文件进行了一些大的改动，使整个框架更加方便人性化。
  • Linux 命令神器：lsof 入门 ronin47 lsof
           lsof是系统管理/安全的尤伯工具。我大多数时候用它来从系统获得与网络连接相关的信息，但那只是这个强大而又鲜为人知的应用的第一步。将这个工具称之为lsof真实名副其实，因为它是指“列出打开文件（lists openfiles）”。而有一点要切记，在Unix中一切（包括网络套接口）都是文件。 有趣的是，lsof也是有着最多
  • java实现两个大数相加，可能存在溢出。 bylijinnan java实现
    import java.math.BigInteger; import java.util.regex.Matcher; import java.util.regex.Pattern; public class BigIntegerAddition { /** * 题目：java实现两个大数相加，可能存在溢出。 * 如123456789 + 987654321
  • Kettle学习资料分享，附大神用Kettle的一套流程完成对整个数据库迁移方法 Kai_Ge Kettle
    Kettle学习资料分享   Kettle 3.2 使用说明书 目录 概述..........................................................................................................................................7 1.Kettle 资源库管
  • [货币与金融]钢之炼金术士 comsci 金融
           自古以来,都有一些人在从事炼金术的工作.........但是很少有成功的        那么随着人类在理论物理和工程物理上面取得的一些突破性进展......        炼金术这个古老
  • Toast原来也可以多样化 dai_lm androidtoast
    Style 1： 默认 Toast def = Toast.makeText(this, "default", Toast.LENGTH_SHORT); def.show(); Style 2： 顶部显示 Toast top = Toast.makeText(this, "top", Toast.LENGTH_SHORT); t
  • java数据计算的几种解决方法3 datamachine javahadoopibatisr-languer
    4、iBatis     简单敏捷因此强大的数据计算层。和Hibernate不同，它鼓励写SQL，所以学习成本最低。同时它用最小的代价实现了计算脚本和JAVA代码的解耦，只用20%的代价就实现了hibernate 80%的功能,没实现的20%是计算脚本和数据库的解耦。     复杂计算环境是它的弱项，比如：分布式计算、复杂计算、非数据
  • 向网页中插入透明Flash的方法和技巧 dcj3sjt126com htmlWebFlash
    将 Flash 作品插入网页的时候，我们有时候会需要将它设为透明，有时候我们需要在Flash的背面插入一些漂亮的图片，搭配出漂亮的效果……下面我们介绍一些将Flash插入网页中的一些透明的设置技巧。 　　一、Swf透明、无坐标控制　　首先教大家最简单的插入Flash的代码，透明，无坐标控制： 　　注意wmode="transparent"是控制Flash是否透明
  • ios UICollectionView的使用 dcj3sjt126com
    UICollectionView的使用有两种方法，一种是继承UICollectionViewController，这个Controller会自带一个UICollectionView；另外一种是作为一个视图放在普通的UIViewController里面。 个人更喜欢第二种。下面采用第二种方式简单介绍一下UICollectionView的使用。 1.UIViewController实现委托，代码如
  • Eos平台java公共逻辑 蕃薯耀 Eos平台java公共逻辑Eos平台java公共逻辑
     Eos平台java公共逻辑 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年6月1日 17:20:4
  • SpringMVC4零配置--Web上下文配置【MvcConfig】 hanqunfeng springmvc4
    与SpringSecurity的配置类似，spring同样为我们提供了一个实现类WebMvcConfigurationSupport和一个注解@EnableWebMvc以帮助我们减少bean的声明。   applicationContext-MvcConfig.xml <!-- 启用注解，并定义组件查找规则 ，mvc层只负责扫描@Controller --> <
  • 解决ie和其他浏览器poi下载excel文件名乱码 jackyrong Excel
       使用poi,做传统的excel导出，然后想在浏览器中，让用户选择另存为，保存用户下载的xls文件，这个时候，可能的是在ie下出现乱码（ie,9,10,11),但在firefox,chrome下没乱码， 因此必须综合判断，编写一个工具类：      /** * * @Title: pro
  • 挥洒泪水的青春 lampcy 编程生活程序员
    2015年2月28日，我辞职了，离开了相处一年的触控，转过身--挥洒掉泪水，毅然来到了兄弟连，背负着许多的不解、质疑——”你一个零基础、脑子又不聪明的人，还敢跨行业，选择Unity3D？“，”真是不自量力••••••“，”真是初生牛犊不怕虎•••••“，••••••我只是淡淡一笑，拎着行李----坐上了通向挥洒泪水的青春之地——兄弟连！ 这就是我青春的分割线，不后悔，只会去用泪水浇灌——已经来到
  • 稳增长之中国股市两点意见-----严控做空，建立涨跌停版停牌重组机制 nannan408
       对于股市，我们国家的监管还是有点拼的，但始终拼不过飞流直下的恐慌，为什么呢？    笔者首先支持股市的监管。对于股市越管越荡的现象，笔者认为首先是做空力量超过了股市自身的升力，并且对于跌停停牌重组的快速反应还没建立好，上市公司对于股价下跌没有很好的利好支撑。    我们来看美国和香港是怎么应对股灾的。美国是靠禁止重要股票做空，在
  • 动态设置iframe高度(iframe高度自适应) Rainbow702 JavaScriptiframecontentDocument高度自适应局部刷新
    如果需要对画面中的部分区域作局部刷新，大家可能都会想到使用ajax。 但有些情况下，须使用在页面中嵌入一个iframe来作局部刷新。 对于使用iframe的情况，发现有一个问题，就是iframe中的页面的高度可能会很高，但是外面页面并不会被iframe内部页面给撑开，如下面的结构： <div id="content"> <div id=&quo
  • 用Rapael做图表 tntxia rap
    function drawReport(paper,attr,data){          var width = attr.width;     var height = attr.height;          var max = 0;   &nbs
  • HTML5 bootstrap2网页兼容（支持IE10以下） xiaoluode html5bootstrap
    <!DOCTYPE html> <html> <head lang="zh-CN"> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他