BootStrap实战二之网站 Logo 添加

青旅半醒 2021-09-13 23:10 316阅读 0赞

**目标网站**：[http://www.ghostchina.com/][http_www.ghostchina.com]

**网站 Logo 添加**

<!DOCTYPE html>
    <html>
    <head lang="en">
        <meta charset="utf-8">
        <link rel="stylesheet" type="text/css" href="bootstrap.min.css" rel="stylesheet">
        <link rel="stylesheet" type="text/css" href="app.css">
    </head>
    <body class="home-template">
        <header class="main-header">  
            <div class="container">   
                <div class="row">     
                    <div class="col-md-12">
                        <a href="branding" href="http://www.jikexueyuan.com title="Ghos开源博客">
                            <img src="http://static.ghostchina.com/image/b/46/4f5566c1f7bc28b3f7ac1fada8abe.png">
                            <h2 class="text-hide">现在你看到的是BootStrap实战实例</h2>
                        </a>
                    </div>
                </div>
            </div>
        </header>

**对应的 app.css 文件内容**

.main-header{ text-align: center; padding: 42px 0; background: #ffffff; }
    
    .main-header .branding{ font-size: 3.5em; color: #303030; }
    
    a{ color: #e67e22; outline: none; text-decoration: none; }
    
    .main-header .branding img{ max-width: 100%; }
    
    a:active,a:focus,a img{ outline: none; }

[http_www.ghostchina.com]: http://www.ghostchina.com/

发表评论取消回复

表情：

评论列表（有 0 条评论，316人围观）

还没有评论，来说两句吧...

相关阅读

相关 c#生成二维码&二维码中间添加定制LoGo

在c#项目中使用QRCoder生成一个二维码，自定义二维码中的文本信息，并且设置logo

爱被打了一巴掌/ 2024年04月23日 20:23/ 0 赞/ 39 阅读

相关 java之运用ImageI为图片添加logo水印

java为图片添加logo水印这里使用了ImageIO图像流技术 public static void main(String[] args) throws

拼搏现实的明天。/ 2023年09月23日 21:33/ 0 赞/ 8 阅读

相关微信支付二维码上添加logo

工具类的使用，分享给大家。先看效果：无logo时： ![20201103151053454.png][] 有logo时： ![20201103145710726.pn

我就是我/ 2022年11月22日 02:49/ 0 赞/ 314 阅读

相关 Bootstrap之网站导航栏制作

网站导航栏制作通过bootstrap变得十分简单。只需要引入相关的样式文件和js文件即可。第一步引入相关文件： <!-- 新 Bootstrap 核心 CSS 文

今天药忘吃喽~/ 2022年09月23日 08:27/ 0 赞/ 187 阅读

相关 ffmpeg 视频添加水印 logo

1、使用ffmpeg 视频添加水印（logo）。在视频行业已经工作了两年多了，最近抽时间把一些处理视频的方法和经验写下来，一来做个记录，二来分享一下一起学习进步。 ff

Dear 丶/ 2022年08月26日 09:00/ 0 赞/ 524 阅读

相关情人节网站logo赏析

一年一度的情人节，不少网站都进行了不错的装点，我们不妨来简单浏览一下，借以触发灵感。百度百度的logo放上了改变，变成了一个gif，图片如下。 ![百度logo

你的名字/ 2022年08月07日 01:37/ 0 赞/ 145 阅读

相关如何在标题栏TITLE前添加网站LOGO

解决办法如下： head标签下添加代码，如下： 1 <link rel="shortcut icon" href="your_ico.ico" type="imag

古城微笑少年丶/ 2022年04月06日 02:36/ 0 赞/ 236 阅读

相关 BootStrap实战四之网站内容添加（下）

网站内容（右）代码： <aside class="col-md-4 sidebar"> <div class="wid

￡神魔★判官ぃ/ 2021年09月13日 23:14/ 0 赞/ 199 阅读

相关 BootStrap实战四之网站内容添加（上）

网站内容代码： <section class="content-wrap"> <div class="container">

冷不防/ 2021年09月13日 23:14/ 0 赞/ 206 阅读

相关 BootStrap实战二之网站 Logo 添加

目标网站：[http://www.ghostchina.com/][http_www.ghostchina.com] 网站 Logo 添加 <!DOCTYPE ht

青旅半醒/ 2021年09月13日 23:10/ 0 赞/ 317 阅读