文字装饰:没有不适用于 ul [英] text-decoration: none not working on ul

问题描述

我看到了很多与此主题相关的问题，但没有一个回答我的问题.我正在为一个网站制作侧边栏，我正在尝试制作与侧边栏宽度相同的框内的链接，只有一点填充，可能是 10-15 像素，并且每个框之间有一点点空间.也许3px.但我似乎无法获得 text-decoration: none;无论我尝试过什么，都可以工作.

这是迄今为止我得到的最成功的代码:

HTML

<h3>导航链接</h3><div id="sidelinks"><ul><li><a href="#">首页</a></li><li><a href="#">个人简介</a></li>

CSS

#sidebar {背景:#464646；宽度:250px；高度:1000px；左边距:50px；边框半径:15px；}h3{字体系列:'Coda'，草书；白颜色;背景:#6B6B6B；字体大小:24px；文本对齐:居中；填充:15px 0 8px 0；边框左上角半径:15px；边框右上角半径:15px；}#sidelinks {字体系列:'Armata'，无衬线；字体大小:25px；文字装饰:无；白颜色;背景色:#4D4D4D；填充:10px；位置:相对；}

解决方案

去掉text-decoration，设置颜色很简单

#sidelinks a {颜色:黑色;文字装饰:无；}

删除点也是如此

#sidelinks ul {列表样式:无；填充:0;保证金:0;}

如果您查看您发布的 CSS，它们实际上都没有针对 <a> 或 <ul> 所以不知道为什么您期望其他样式而不是默认的.

小提琴没有一切，但它应该给你正确的方向:http://jsfiddle.net/eNUpJ/

I've seen a lot of questions relating to this subject but none of them answered my question. I am making a sidebar for a site and I'm trying to make the links in boxes that are the same width as the sidebar, have just a little padding, maybe 10-15px and a tiny bit of space between each. Maybe 3px. But I can't seem to get text-decoration: none; to work no matter what I've tried.

This is the most successful code I've gotten so far:

HTML

<div id= "sidebar">
    <h3>Navigation Links</h3>
    <div id= "sidelinks">
        <ul>
            <li><a href= "#">Home</a></li>
            <li><a href= "#">Biography</a></li>
        </ul>
    </div>
</div>

CSS

#sidebar {
    background: #464646;
    width: 250px;
    height: 1000px;
    margin-left: 50px;
    border-radius: 15px;
}
h3 {
    font-family: 'Coda', cursive;
    color: white;
    background: #6B6B6B;
    font-size: 24px;
    text-align: center;
    padding: 15px 0 8px 0;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}
#sidelinks {
    font-family: 'Armata', sans-serif;
    font-size: 25px;
    text-decoration: none;
    color: white;
    background-color: #4D4D4D;
    padding: 10px;
    position: relative;
}

解决方案

Removing the text-decoration and setting the colour is easy

#sidelinks a {
    color:black; 
    text-decoration:none;
}

So is removing the dots

#sidelinks ul {
    list-style:none;
    padding:0;
    margin:0;
}

If you look at the CSS you posted none of it was actually targeting <a> or <ul> so not sure why you were expecting other style than the default ones.

The fiddle doesn't have everything but it should send you in the right direction: http://jsfiddle.net/eNUpJ/

这篇关于文字装饰:没有不适用于 ul的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！