Django企业开发实战-blog项目(8)

最新推荐文章于 2023-03-13 17:31:43 发布

羊羊是条咸鱼

最新推荐文章于 2023-03-13 17:31:43 发布

阅读量227

点赞数

分类专栏： Python Django项目文章标签： html django

本文链接：https://blog.csdn.net/yt_xy/article/details/107617978

版权

github链接 https://github.com/yt-xy/Django-blog

引入Bootstrap

页面脚手架：比如样式重置、浏览器兼容、栅格系统和简单布局
基础的CSS样式：比如代码高亮、排版、表单、表格和一些小的样式效果
组件：提供了很多常用组件，如tab、pill、导航、弹窗、顶部栏和card等
JavaScript插件：主要是一些动态功能，比如下拉菜单、模态窗口和进度条等

简单的页面布局

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>blog - by yt_xy</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.0.0/css/bootstrap.css">
    <style>
        .post{
    
            margin-bottom: 5px;
        }
    </style>
</head>
<body>
    <div class="container head">
        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <a class="navbar-brand" href="#">首页</a>
            <div class="collapse navbar-collapse" id="navbarSupportedContent">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item">
                        <a class="nav-link" href="#">Python</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Django实战</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Tornado</a>
                    </li>
                </ul>
                <form class="form-inline my-2 my-log-0">
                    <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
                    <button class="btn btn-outline-success" type="submit">搜索</button>
                </form>
            </div>
        </nav>
        <div class="jumbotron">
            <h1 class="disaply-4">Blog</h1>
            <p class="lead">基于Django的多人博客系统</p>
        </div>
    </div>
    <div class="container main">
        <div class="row">
            <div class="col-9 post-list">
                <div class="card post">
                    <div class

最低0.47元/天解锁文章

羊羊是条咸鱼

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Django企业开发实战-blog项目(8)

github链接 https://github.com/yt-xy/Django-blog简单的页面布局<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>blog - by yt_xy</title> <meta name="viewport" content="width=device-width, init.
复制链接

扫一扫