得到noCopy文本为粗体

Question

新手在这里。

因此，我在顶部栏上显示了活动按钮，并在其中写有文本“Základ”（基本），我还想使其无法复制，因此看起来更好，所以我做到了。但是现在，当我想使其变粗时，我不能！对于font-weigh：粗体;不起作用。我使用外部CSS文件。我不想放弃拥有无法复制的大胆标题的梦想，因此我向您寻求帮助。任何东西！

html,
body {
    margin: 0px;
    padding: 0px
}

body {
    font-family: "Lato", sans-serif;
    transition: background-color .5s;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.2s;
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

#main {
    transition: margin-left .5s;
    text-align: center;
    padding-left: 16px;
    font-size: 20px;
}

#posunTlacitka {
    transition: margin-left .4s;
    text-align: center;
}

#posunListy {
    transition: margin-left .5s;
}

@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

    .sidenav a {
        font-size: 18px;
        
    }
}


/*HORNÍ LIŠTA*/
.topnav {
    overflow: hidden;
    background-color: #333;
}


.topnav a {
    float: left;
    color: rgb(243, 243, 243);
    text-align: center;
    padding: 0px 35px;
    text-decoration: none;
    font-size: 17px;
}

.topnav div {
    float: left;
    color: rgb(243, 243, 243);
    text-align: center;
    padding: 12px 30px;
    text-decoration: none;
    font-size: 17px;
}

.topnav a.active {
    background-color: #62d1ff;
    color: black;
}

/*LIŠTA NELZE KOPÍROVAT!*/
#noCopy::before {
    content: 'Základ';
    display: block;
}

    <div id="posunListy">
        <div class="topnav">
            <div id="posunTlacitka"><span style="font-size:30px;cursor:pointer" onclick="openNav()">&#9776; </span></div>
            <a class="active">
                <h2 id="noCopy"></h2>
            </a>
        </div>
    </div>

Answer 1

根据上述评论之一，您的代码段已经显示该文本为粗体。设置以下内容时，您可以看到这种区别：

#noCopy::before {
    content: 'Základ';
    display: block;
    font-weight: normal;
}

...导致以下代码段。如果看不到开发环境的差异，则可能是浏览器缓存问题。无论哪种方式，您都已经像拉托那样害怕了，因为它已经大胆了……

编辑：这将“增强”效果，但这是一种解决方法

本质上，在-webkit-text-stroke: 1px black;上添加#noCopy::before会在文本上添加轮廓笔画，给人以较粗的印象

html,
body {
    margin: 0px;
    padding: 0px
}

body {
    font-family: "Lato", sans-serif;
    transition: background-color .5s;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}

.sidenav a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #818181;
    display: block;
    transition: 0.2s;
}

.sidenav a:hover {
    color: #f1f1f1;
}

.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

#main {
    transition: margin-left .5s;
    text-align: center;
    padding-left: 16px;
    font-size: 20px;
}

#posunTlacitka {
    transition: margin-left .4s;
    text-align: center;
}

#posunListy {
    transition: margin-left .5s;
}

@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

    .sidenav a {
        font-size: 18px;
        
    }
}


/*HORNÍ LIŠTA*/
.topnav {
    overflow: hidden;
    background-color: #333;
}


.topnav a {
    float: left;
    color: rgb(243, 243, 243);
    text-align: center;
    padding: 0px 35px;
    text-decoration: none;
    font-size: 17px;
}

.topnav div {
    float: left;
    color: rgb(243, 243, 243);
    text-align: center;
    padding: 12px 30px;
    text-decoration: none;
    font-size: 17px;
}

.topnav a.active {
    background-color: #62d1ff;
    color: black;
}

/*LIŠTA NELZE KOPÍROVAT!*/
#noCopy::before {
    content: 'Základ';
    display: block;
    -webkit-text-stroke: 1px black;
}

    <div id="posunListy">
        <div class="topnav">
            <div id="posunTlacitka"><span style="font-size:30px;cursor:pointer" onclick="openNav()">&#9776; </span></div>
            <a class="active">
                <h2 id="noCopy"></h2>
            </a>
        </div>
    </div>