Question

需要帮助使用css代码来获取此网站上方和下方的边框：http://www.simpsonmagazine.cc/。我还想更改网站的滑块高度：http://www.etctaylors.com/

到目前为止使用的CSS代码：

/*
Theme Name:   Sight Child
Theme URI:    http://example.com/twenty-fourteen-child/
Description:  Twenty Fourteen Child Theme
Author:       John Doe
Author URI:   http://example.com
Template:     Sight
Version:      1.0.0
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, 
accessibility-ready
Text Domain:  sight-child
*/
/* =Theme customization starts here
-------------------------------------------------------------- */
.main-navigation {
border-bottom: solid;
border-color: black;
border-width: 3px;
}

.main-navigation li {
text-indent: 5px;
}

.main-navigation ul {
margin-left: auto;
margin-right: auto;
width: 100%;
}

.main-navigation li {
border: none;
}

.main-navigation {
margin-left: 0;
margin-right: 0;
width: 100%;
}

.main-navigation li:hover > a, .main-navigation ul ul :hover > a, 
.main-navigation ul ul a:hover {
color: black !important;
text-decoration: none;
}

.main-navigation ul ul, .main-navigation ul li:hover {
background: none;
}

.main-navigation ul ul {
background: none;
}

.main-navigation ul ul a {
color: grey;
}

Answer 1

将此标题用于标题css

所提到的网站

<强>标记

 <div id="top">
    <div id="hwrap">
    </div>
    </div>

您应该在hwrap div

中包含您的标题内容

<强> CSS

  #top {
        width: 940px;
        float: left;
        border-bottom: 5px solid #222;
        border-top: 5px solid #222;
        padding-top: 1px;
        margin-bottom: 20px;
        padding-bottom: 1px;
        }
        #hwrap {
        width: 940px;
        float: left;
        border-bottom: 1px solid #222;
        border-top: 1px solid #222;
        padding-top: 20px;
        margin-bottom: 0px;
        padding-bottom: 20px;
    }

DEMO

用于更改网站中的滑块高度

  .featured-post {
background: #ffea97;
height:600px;  // or your prefered vaklue
}

Answer 2

要在导航中添加边框，可以使用以下css行： border-top：3px纯黑色;

滑块高度变化是什么意思？

Here is a Jsfiddle i made

Answer 3

试试这个它会起作用，我在firebug上尝试过 enter image description here

.site-header{
        border-bottom: 1px solid #000;
        border-top: 1px solid #000000;
        height: 240px;
        padding: 3px 0 3px 0;
        position: relative;
    }

    .site-header:before {
        content: '';
        border-top: 5px solid #000;
        width:100%;
        position: absolute;
        left:0;
        top: 1px;
    }

    .site-header:after {
        content: '';
        border-top: 5px solid #000;
        position:absolute;
        width:100%;
        left:0;
        bottom:1px;
    }

边界的Css代码＆amp;滑块大小

3 个答案: