Question

我需要修复一些现有的html内容。 CSS非常令人费解，但是，我有一件事情是我无法摆脱的。

所有ul li列表在圆/点和li项文本之间都有一条中间灰色垂直线。第一项是好的，它只是在第一项之后一直出现。第一项很好。

我尝试了边距0和填充0无效。

任何人都能看到类似的东西并知道如何解决它？

这是代码，我得到了。放入.html并在firefox中查看。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<!-- InstanceBegin template="/templates/standard_menus_fixed.dwt" codeOutsideHTMLIsLocked="false" -->
<head id="Template_Head1"><title>
    Bereavement: key facts
</title><link href="/WebResource.axd?d=5l5Vc4D6yAURPWhWXhJ1YxVmorTrcBTS6LeygIpuH99gHY_hxCH5iVrseffmyXJjODvXT-h-Cep60waS6UnK9oPqL7YFeDCBMOyrJ_54mXW-llvBQnPFG49p21uK3ml9R2ozACJMx6EY-iFhJJSIGm4N0WI1&amp;t=635101844810114495" type="text/css" rel="stylesheet" /><base href="http://www.rcpsych.ac.uk/" /><link href="/templates/default/css/system/system.css" type="text/css" rel="stylesheet" /><link href="/templates/default/css/system/standard.css" type="text/css" rel="stylesheet" />
    <!--<link href="/templates/default/css/main.css" type="text/css" rel="stylesheet" />-->
    <!--New site styles added by JainA00 07/08/2012-->
    <link href="/templates/default/css/newSite/global.css" type="text/css" rel="stylesheet" media="screen,projection" /><link rel="stylesheet" href="/templates/default/css/newsite/print.css" type="text/css" media="print" />
        <!--[if lte IE 7]>
  <link rel="stylesheet" href="/templates/default/css/newSite/ie8.css" media="screen,projection" type="text/css" />
  <![endif]-->
    <!--[if lte IE 6]>
  <link rel="stylesheet" href="/templates/default/css/newSite/ie7.css" media="screen,projection" type="text/css" />
  <![endif]--> 
    <link rel="stylesheet" href="/templates/default/css/n_red.css" media="screen,projection" type="text/css" />
    <script type="text/javascript" src="/../../scripts/jquery-1.6.2.min.js"></script>

    <script type="text/javascript" src="/../../scripts/jquery.overlabel.js"></script>

    <script type="text/javascript" src="/../../scripts/jquery.hoverIntent.minified.js"></script>

    <script type="text/javascript" src="/../../scripts/main-functions.js"></script>


    <meta name="robots" content="canonical" /><meta name="GENERATOR" content="Immediacy .NET CMS - Licensed To : The Royal College of Psychiatrists" /><meta name="keywords" content="bereavement, grief, death, depression, antidepressants, grieving" /><meta name="description" content="Bearevement: what happens when you loose someone you love: produced by the Royal College of Psychiatrists" /><!-- MY CSS --><style media="screen" type="text/css">body{overflow-x: hidden;}#page-wrapper{background-image: url("");width:630px;left:100px;margin-left:0px;} #page-inner{     background-image: url("");width:820px;left:0px;margin-left:0px;} #top-layer em{background-image: url("");}
    ul{width:85%; background-color:#ffcccc; margin:0; padding:0; padding-left:20px; border:none;}
    li{width:100%; background-color:#ff0000; margin:0; padding:0; border:none;}

    </style></head>
<body class="mainBody">

<div id="top-layer">
    <!-- KILL TOP LAYER -->
    <div id="page-wrapper">
        <div id="page-inner">
        <div id="page-inner">
            <div id="breadCrumb">

<!-- KILL BREADCRUMB -->   </div>
            <div id="main-layer">
                <div id="main-content">

                    <div id="mainContent">

<h3><strong>What if I can't come to terms with it?</strong></h3>

<ul>
<li>You may have problems if you can't grieve properly at the time
of your loss because of family or business commitments. Some people
don&rsquo;t appear to grieve at all and return quickly to their normal
life,&nbsp;but then, years later, have odd physical symptoms or
spells of depression.</li>
<li>If you have had a stillbirth, miscarriage or abortion, other
people may not understand why you feel so deeply about it. This can
make you feel very alone and low.</li>
<li>You may start to grieve, but get stuck. The early sense of
shock and disbelief goes on. Years may pass and still you find it
hard to believe that the person you loved is dead.</li>
<li>You may find that you can&rsquo;t think of anything else, perhaps
making the room of the dead person into a shrine.</li>
<li>Occasionally, you may feel so low that you have thoughts of
killing yourself and may even stop eating and drinking.</li>
<li>Bereavement can affect your physical health, with an increased
risk of cancer and heart disease. Some older people may die very
soon after their partner or spouse has died.</li>
</ul>

</body>
<!-- InstanceEnd -->
</html>

Answer 1

为了删除圆/点和li项文本之间的灰色中间垂直线，尝试将以下CSS样式添加到'li'元素： border-left：0px！important; 。这里是'li'元素的最终CSS样式：

li{
width:100%; 
background-color:#ff0000; 
margin:0; 
padding:0; 
border:none; 
border-left: 0px !important;
}

CSS ul li第二个和后面的列表项具有灰色垂直线

1 个答案: