Question

我正在尝试将菜单项的文本颜色更改为白色，或者至少更改为活动菜单的颜色。

这是我的HTML：

import smtplib
from email.mime.multipart import MIMEMultipart
from email.mime.text import MIMEText
from email.mime.image import MIMEImage

with open('df.html', 'w') as fil:
    df.head().to_html(fil)

att1 = 'df.html'
att2 = path + 'Indices.png'
att3 = path + 'Segments.png'
subject = 'Market Update'
body = 'This Weeks Report'

msg = MIMEMultipart('alternative')
msg["To"] = myEml
msg["From"] = myEml
msg["Subject"] = subject

with open(att1, 'r') as fp:                                                    
    html = fp.read()

msgText = MIMEText('<b>%s</b><br>%s<img src="cid:%s"><br><img src="cid:%s"><br>' % (body, html, att2, att3), 'html')
msg.attach(msgText)

with open(att2, 'rb') as fp:
    img = MIMEImage(fp.read())
img.add_header('Content-ID', '<{}>'.format(att2))
msg.attach(img)

with open(att3, 'rb') as fp:                                                   
    img = MIMEImage(fp.read())
img.add_header('Content-ID', '<{}>'.format(att3))
msg.attach(img)

s = smtplib.SMTP_SSL(mySMTP, smtpPORT)
s.ehlo()
s.starttls()
s.login(username,password)
s.sendmail(me,you, msg.as_string())
s.quit()

和我的SCSS：

<nav class="navbar navbar-expand-md navbar-dark bg-primary py-0">
    <div class="container">
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarCollapse">
            <ul class="navbar-nav ml-auto">
                <li class="nav-item active">
                    <a class="nav-link" href="@Url.Action("Index","Employee")">Access List</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="@Url.Action("Index","Log")">Logs</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

我假设在.nav-link部分设置颜色会做出更改。我试过了，但是没用。

$main-color: $blue;         

//=====  Navbar  =====
$active-bg-color: darken($main-color, 10%);       

.navbar {
    border-bottom: 1px solid darken($active-bg-color, 20%);
}

.nav-link {
    &:hover {
        background-color: $active-bg-color;
    }
}

.navbar-dark .navbar-nav .active > .nav-link {
    background-color: $active-bg-color;
}

.nav-item {
    border-left: 1px solid rgba(255, 255, 255, 0.1);
    border-right: 1px solid rgba(0, 0, 0, 0.2);
}

我也尝试添加它，但是它也不起作用。

.nav-link {
    color = white;
    &:hover {
        background-color: $active-bg-color;
    }
}

这是我的菜单的样子。我正在尝试使文本处于活动状态或不处于活动状态时具有相同的颜色。

有什么建议吗？

Answer 1

您需要为navbar-dark链接更改这些SASS变量...

$navbar-dark-color:         $white;
$navbar-dark-hover-color:   $white;

演示：https://www.codeply.com/go/ZO83BzTPtD

Or ，以及CSS：

.navbar-dark .navbar-nav .nav-link {
    color: #ffffff;
}

Bootstrap 4 SCSS-更改导航栏菜单颜色？

1 个答案: