zoukankan      html  css  js  c++  java

  • Day 作业(博客园首页/js日期格式)

    博客园个人首页搭建

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="blog样式.css">
</head>
<body>
<div class="blog-left">
    <div class="blog-avatar">
        <img src="xiaomai.png" alt="">
    </div>
    <div class="blog-title">
        <p>tiny的个人博客</p>
    </div>
    <div class="blog-info">
        <p>这个人什么都没留下!</p>
    </div>
    <div class="blog-link">
        <ul>
            <li><a href="">关于我</a></li>
            <li><a href="">微博</a></li>
            <li><a href="">微信公众号</a></li>
        </ul>
    </div>
    <div class="blog-tag">
        <ul>
            <li><a href="">#Python</a></li>
            <li><a href="">#Java</a></li>
            <li><a href="">#Golang</a></li>
        </ul>
    </div>
</div>
<div class="blog-right">
    <div class="article-list">
        <div class="article-title">
            <span class="title">HTML概述</span>
            <span class="date">2019/11/15</span>
        </div>
        <div class="article-content">
            HTML是超文本标记语言...
        </div>
        <div class="article-bottom">
            #HTML
        </div>
    </div>
    <div class="article-list">
        <div class="article-title">
            <span class="title">HTML概述</span>
            <span class="date">2019/11/15</span>
        </div>
        <div class="article-content">
            HTML是超文本标记语言...
        </div>
        <div class="article-bottom">
            #HTML
        </div>
    </div>
    <div class="article-list">
        <div class="article-title">
            <span class="title">HTML概述</span>
            <span class="date">2019/11/15</span>
        </div>
        <div class="article-content">
            HTML是超文本标记语言...
        </div>
        <div class="article-bottom">
            #HTML
        </div>
    </div>
    <div class="article-list">
        <div class="article-title">
            <span class="title">HTML概述</span>
            <span class="date">2019/11/15</span>
        </div>
        <div class="article-content">
            HTML是超文本标记语言...
        </div>
        <div class="article-bottom">
            #HTML
        </div>
    </div>
    <div class="article-list">
        <div class="article-title">
            <span class="title">HTML概述</span>
            <span class="date">2019/11/15</span>
        </div>
        <div class="article-content">
            HTML是超文本标记语言...
        </div>
        <div class="article-bottom">
            #HTML
        </div>
    </div>
    <div class="article-list">
        <div class="article-title">
            <span class="title">HTML概述</span>
            <span class="date">2019/11/15</span>
        </div>
        <div class="article-content">
            HTML是超文本标记语言...
        </div>
        <div class="article-bottom">
            #HTML
        </div>
    </div>
</div>
</body>
</html>

    
/*通用样式*/
body {
    margin: 0;
    background: #eeeeee;
}

a {
    text-decoration: none;
}

ul {
    list-style-type: none;
    padding-left: 0;
}


/*左侧样式*/
.blog-left {
    float: left;
     20%;
    height: 100%;
    background: #4e4e4e;
    position: fixed;
}

.blog-avatar {
     200px;
    height: 200px;
    border: 5px solid white;
    border-radius: 50%;
    overflow: hidden;
    margin: 20px auto;
}

.blog-title, .blog-info{
    font-size: 14px;
    text-align: center;
}

.blog-link a, .blog-tag a {
    text-align: center;
    color: darkgray;
}

.blog-link a:hover, .blog-tag a:hover {
    color: white;
}

.blog-link ul,.blog-tag ul {
    text-align: center;
    margin: 60px 0;
}

/*右侧边框*/
.blog-right {
    float: right;
     80%;
    height: 1000px;
}

.article-list {
    background: white;
    margin:10px 20px;
    box-shadow: 5px 5px 5px rgba(129,70,34,0.8);
}

.article-title {
    border-left: 5px red solid;
}

.article-title span.title {
    font-size: 35px;
    margin-left: 5px;
}

.article-title span.date {
    float: right;
    font-size: 15px;
    margin: 10px;
}

.article-content {
    /*text-indent: 10px;*/
    margin: 10px;
}

.article-bottom {
    border-top: 1px solid;
    /*text-indent: 10px;*/
    padding: 10px;
}

    1.编写代码，将当前日期按“2017-12-27 11:11 星期三”格式输出

    var d = new Date();

function get_date(d) {
	day = d.getDate();
	month = d.getMonth() + 1;
	year = d.getFullYear();
	hour = d.getHours();
	minute = d.getMinutes();

	switch (d.getDay()) {
    case 1:
    	return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ' ' + "星期一";
    case 2:
		return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ' ' + "星期二";
    case 3:
		return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ' ' + "星期三";
    case 4:
		return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ' ' + "星期四";
 	case 5:
		return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ' ' + "星期五";
 	case 6:
		return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ' ' + "星期六";
	case 7:
		return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ' ' + "星期日";
}
}

get_date(d);
  • 相关阅读:
    grep
    virtualbox共享文件夹无法创建软链接的解决方法
    openH264的双向链表实现
    openH264构建过程
    Ninja构建系统入门
    ubuntu上安装meson & 如何使用meson编译C代码
    ln: failed to create symbolic link ‘libopenh264.so.6’: Operation not permitted
    RAII-资源获取即初始化
    可变参数实现原理-参数栈
    一个统计多文件单行字符串出现次数QT实现
  • 原文地址：https://www.cnblogs.com/2222bai/p/11872319.html
Copyright © 2011-2022 走看看