代码之家 › 专栏 › 技术社区 › 65 sami

在CSS中删除点而不松开调整后的形状

web css html

65 sami · 技术社区 · 3 年前

我是这个游戏的新手,我需要一些帮助。在我求助于此网站之前,我研究了我的问题的解决方案,其中之一是以下方法:

不带项目符号的列表项

第二项

通过应用此方法,我松开了调整后的格式设置,即使我不希望这样

HTML代码:

</div>
    <div class= "link-container">
    <h6 class="links">
        
 <li>
     <a href="https://www.visitberlin.de/de/sehenswuerdigkeiten-berlin" class="linkButton.clearbutton"
     itemprop="possibilities"> SehenswÃ¼rdigkeiten</a>
        </a>
 </li>

 <li> 
        <a href="https://service.berlin.de/behoerden/" class="linkButton.clearbutton" 
        itemprop="possibilities">BehÃ¶rden </a>
 </li>

<li>
    <a href="https://www.berlin.de/clubs-und-party/clubguide/a-z/" class="linkButton.clearbutton"
    itemprop="possibilities">Clubs</a>
 </li>

<li>
    <a href="https://www.berlin.de/tourismus/parks-und-gaerten/" class="linkButton.clearbutton" 
    >Parks</a>
 </li>

 <li>
    <a href="https://www.berlin.de/stadtplan/" class="linkButton.clearbutton"
    itemprop="possibilities" >Stadtkarte</a>
</li>
    </h6>
</div>

CSS代码:

 .link-container {
    background-color: #4e4e4e91;
    border-color:rgba(129, 191, 235, 0.978);
    border-width: 1px;
    border-style: solid;
    height: 50%;
    border: 2px solid rgba(129, 191, 235, 0.978) ;
    border-radius: 30px;

    }

        .links {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-left: 100px;
            margin-right: 100px;
        }

        a {
            color: rgb(245, 245, 245);
            text-decoration: none;
            font-weight: bold; 
            border: 1px solid ;
            background: 0;
            font-weight: 600;
            border-radius: 40px;
          
    
    padding: 0 10px;   
        }
        
        a:hover{
            
            color: rgb(129, 191, 235)
            
            
        }

        .input-box {
            background-color: white;
            color: gb(129, 191, 235);
        }

2 回复 | 直到 3 年前

MFerguson 3 年前

正如Thomas L.在评论中提到的,您可以向代码中添加CSS样式的组件,以隐藏为li标记创建的要点。

因此,在每个li标记中,您可以这样更改它们:

<li style="list-style: none">

这是您修改后的代码:

.link-container {
    background-color: #4e4e4e91;
    border-color:rgba(129, 191, 235, 0.978);
    border-width: 1px;
    border-style: solid;
    height: 50%;
    border: 2px solid rgba(129, 191, 235, 0.978) ;
    border-radius: 30px;

    }

        .links {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-left: 100px;
            margin-right: 100px;
        }

        a {
            color: rgb(245, 245, 245);
            text-decoration: none;
            font-weight: bold; 
            border: 1px solid ;
            background: 0;
            font-weight: 600;
            border-radius: 40px;
          
    
    padding: 0 10px;   
        }
        
        a:hover{
            
            color: rgb(129, 191, 235)
            
            
        }

        .input-box {
            background-color: white;
            color: gb(129, 191, 235);
        }

<div>
    <div class= "link-container">
      <h6 class="links">
        
     <li style="list-style: none">
         <a href="https://www.visitberlin.de/de/sehenswuerdigkeiten-berlin" class="linkButton.clearbutton" itemprop="possibilities"> SehenswÃ¼rdigkeiten</a>
     </li>

     <li style="list-style: none"> 
            <a href="https://service.berlin.de/behoerden/" class="linkButton.clearbutton" 
            itemprop="possibilities">BehÃ¶rden </a>
     </li>

    <li style="list-style: none">
        <a href="https://www.berlin.de/clubs-und-party/clubguide/a-z/" class="linkButton.clearbutton"
        itemprop="possibilities">Clubs</a>
     </li>

    <li style="list-style: none">
        <a href="https://www.berlin.de/tourismus/parks-und-gaerten/" class="linkButton.clearbutton" 
        >Parks</a>
     </li>

     <li style="list-style: none">
        <a href="https://www.berlin.de/stadtplan/" class="linkButton.clearbutton"
        itemprop="possibilities" >Stadtkarte</a>
    </li>
      </h6>
      </div>
</div>

65 sami 3 年前

删除元素附加元素

并在css代码中插入以下方法: li{列表样式类型:无;}