标签: border

如何将阴影应用于特定边框边缘？

例如,我有以下代码:

header nav {
    border-top: 1px solid #202020;
    margin-top: 25px;
    width: 158px;
    padding-top:25px;
}

我想要一个仅应用于border-top的投影(1px 1px 1px #cdcdcd).

实现这一目标的最佳方法是什么？

编辑

这基本上就是我在寻找的东西

div {
    border-top: 1px solid #202020;
    margin-top: 25px;
    margin-left:25px;
    width: 158px;
    padding-top:25px;
    -webkit-box-shadow: 0px 1px 1px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    0px 1px 1px rgba(50, 50, 50, 0.75);
    box-shadow:         0px 1px 1px rgba(50, 50, 50, 0.75);
}

但是,阴影似乎受到填充的影响.无论如何都要将阴影单独附加到边框而不调整填充？

是否可以使边框的颜色与背景颜色相同？在我的示例中,它应该具有相同的颜色,但边框颜色总是比背景颜色稍暗.

.box {
    min-width: 50px;
    background: rgba(0, 0, 0, .2);
    border: 10px solid rgba(0, 0, 0, .2);
}

<div class="box">foo</div>

我需要更改图标的边框宽度 - fa-comment-o.我们可以用css改变边框宽度大小吗？

我试图建立多个边框，这些边框在用户图像周围逐渐消失。我正在这样编写CSS，但这无济于事：

width: 90px;
border-radius: 50%;
box-shadow:
inset 0 0 0 4px #eee,
inset 0 0 0 8px #ddd,
inset 0 0 0 12px #ccc,
inset 0 0 0 16px #bbb,
inset 0 0 0 20px #aaa,
inset 0 0 0 20px #999,
inset 0 0 0 20px #888;

但是它没有提供预期的输出。我该如何实现？

我有下面的边框.为什么我的TextBlock的前景正常工作但边框的背景始终保持不变(就好像IsDeleted属性始终为false)

<Border DockPanel.Dock="Top" BorderBrush="Black" Background="#CBE2FF" BorderThickness="2" CornerRadius="5" Padding="0" Margin="5">
    <Border.Style>
        <Style TargetType="{x:Type Border}">
            <Style.Triggers>
                <DataTrigger Binding="{Binding IsDeleted}" Value="True">
                    <Setter Property="Background" Value="#A00000"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Border.Style>
    <TextBlock Margin="5" FontWeight="Bold" FontSize="14" Text="Queue Details">
        <TextBlock.Style>
            <Style TargetType="{x:Type TextBlock}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IsDeleted}" Value="True">
                        <Setter Property="Foreground" Value="White"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </TextBlock.Style>
    </TextBlock>
</Border>

我想知道在GridView中的项目(当前是文本视图)之间绘制分隔符的最简单方法.我能想到的唯一方法是在这些文本视图周围绘制边框,因此在组合时,它们看起来像连续的水平和垂直分隔线.

列表视图有一个setDivider()但不是gridviews吗？

谢谢.

我有一个1px边框的div,我正在尝试用另一种颜色为该div创建一个3px边框.我正在使用此代码:

box {
  border: 1px solid #ddd;
  border-top: 3px solid #3F9BD0;
}

但在角落边界不好,见图:

如何使这个边框看起来很好,像这样:

小提琴:https://jsfiddle.net/15tory3z/

我使用的是Firefox 3.5.7,并且我在多个HTML表格中使用了相同的CSS,但是有些示例中没有显示部分边框.

对我来说没有意义的是,另一个HTML表格在同一页面上的相同CSS工作正常.此外,从边界的角度来看,Internet Explorer中的同一页面看起来很好.

这是一个带有示例的图像,在这种情况下您可以看到第一个表的底部缺少边框.

有没有人知道为什么会发生这种情况？

我有一个类在运行时将虚线样式边框属性应用于文本块.我试图找到一个使用CSS的解决方案,使边框像gif图像一样移动.

有没有办法实现这个目标？

我想删除这个边框:

并且因为它仅在焦点上显示,所以我无法使用chrome控制台找到要覆盖的类.

有没有人这样做,知道我应该覆盖什么类？

编辑:我想这是标准行为,在这里您可以看到示例.我也在使用Chrome.