Ondersteuning » Thema en CSS/opmaak » PAGINA kleur aanpassen in Style Sheet

  • Exclusiveskins

    (@exclusiveskins)


    exclusivesins.com Omdat op mijn HOMEPAGE geen mogelijkheid is mijn page op te slaan als ” homepage” en ik dus ALTIJD een pagina OVER mijn filmpje heen krijg (zie vorige post)

    heb Ik uit mijn style sheet CSS in Shotshutter mijn code eerst vanuit FTP in wordpad geplakt om in elk geval mijn paginas format ZWART ipv wit TE KRIJGEN; WAAR VERANDER IK DIT?!
    #primary, #secondary{
    padding-top: 20px;
    padding-bottom: 20px;
    display: table;
    }

    /* Header */

    #masthead{
    height: 80px;
    background: rgba(0,0,0,.7);
    position: fixed!important;
    z-index: 1000;
    top:30px;
    left: 0px;
    width: 100%;
    }

    .site-branding{
    width: 250px;
    height: 80px;
    background: #0e2f44;
    float: left;
    }

    .logo{
    margin-top:15px;
    margin-left: 10px;
    }

    .logo a{
    display: block;
    }

    .menu-btn{
    width: 60px;
    height: 80px;
    color: #fff;
    background: #000 url(../images/menu.png) no-repeat 15px 20px;
    float: left;
    text-align: center;
    cursor: pointer;
    display: none;
    }

    @media screen and (max-width: 960px){
    .pushy{
    font-size: 1.0em;
    }
    .menu-btn{
    display: block;
    }
    .main-navigation{
    display: none;
    width: 0px;
    }
    #masthead{
    background: #000;
    top:0px;
    }
    .pushy{
    display: block;
    }
    }
    /* Homepage slideshow */

    #home-slider{
    position: relative;
    background: #000;
    }

    /* Content */

    .page-header{
    padding-bottom: 20px;
    margin: 0px 20px;
    border-bottom: 1px dotted #eee;
    }

    h1.page-title {
    font-size: 20px;
    margin-top:20px;
    }

    .page-header p{
    margin: 0px;
    }
    .site-cover{
    background: #0e2f44;
    margin-top:150px;
    margin-bottom: 60px;
    box-shadow: 0px 0px 5px #999;
    }

    .hentry{
    padding: 20px 20px 0px 20px;

    }
    .hentry img{
    width: auto;
    max-width: 100%;
    height: auto;
    }
    .entry-header{
    padding: 0px 0px;

    }

    h1.entry-title{
    font-size: 30px;
    text-transform: uppercase;
    color: #222;
    margin: 10px 0px 20px;
    line-height: 120%;
    }

    h1.entry-title a{
    color: #222;
    }
    .entry-header .entry-meta{
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    font-size: 12px;
    padding: 3px 0px;
    text-transform: uppercase;
    color: #777;
    }

    .entry-header .entry-meta a{
    color: #777;
    }

    span.author, span.clock, span.comm{
    margin-right: 10px;
    }

    span.author:before{
    font-family: dashicons;
    content: “\f110”;
    margin-right: 5px;
    font-size: 14px;
    vertical-align: middle;
    }

    span.clock:before{
    font-family: dashicons;
    content: “\f469”;
    margin-right: 5px;
    font-size: 14px;
    vertical-align: middle;
    }

    span.comm:before{
    font-family: dashicons;
    content: “\f101”;
    margin-right: 5px;
    font-size: 14px;
    vertical-align: middle;
    }

    img.postimg{
    margin-bottom: 10px;
    }

    footer.entry-meta{
    font-size: 12px;
    text-transform: uppercase;
    border-top:1px solid #ddd;
    border-bottom: 1px solid #ddd;
    padding: 5px 0px;
    }
    span.cat-links:before{
    font-family: dashicons;
    content: “\f323”;
    margin-right: 5px;
    font-size: 14px;
    vertical-align: middle;
    }

    /* Widgets */

    .widget {
    margin: 30px 0px 20px 0px;
    padding: 0px 20px;
    }

    h1.widget-title, h3.sidetitl {
    font-size: 16px;
    color:#000;
    height: 40px;
    text-transform: uppercase;
    margin-bottom: 0px;
    }

    .widget ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px 0px 20px 0px;
    }

    .widget li {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    }

    .widget ul ul {
    list-style-type: none;
    background-repeat: no-repeat;
    margin: 0px;
    padding: 0px;
    }

    .widget ul li {
    list-style-type: none;
    margin: 0px;
    margin: 0px 0px;
    color: #5a5a5a;
    }

    .widget ul li a:link,.widget ul li a:visited {
    color: #5a5a5a;
    text-decoration: none;
    }

    .widget.widget_categories ul li,.widget.widget_pages ul li,.widget.widget_archive ul li,.widget.widget_links ul li,.widget.widget_meta ul li {
    border-bottom: 1px dotted #ddd;
    padding: 5px 0px;
    }

    .widget.widget_recent_entries ul li {
    padding: 7px 0px;
    border-bottom: 1px dotted #ddd;
    }

    .widget ul#recentcomments li.recentcomments {
    border-bottom: 1px dotted #ddd;
    padding:5px 0;
    }

    .widget .textwidget p {
    padding: 0px 0px;
    }

    .widget .tagcloud {
    padding: 0px 0px 20px 0px;
    }

    .widget .tagcloud a{
    color:#F5634A;
    }

    .widget #calendar_wrap{
    padding:0px 20px 20px 20px;
    color: #6f7779;
    }

    .widget_ns_mailchimp{
    background: #fff;
    border:1px solid #eaeaea;
    padding: 20px 20px;
    }

    .widget_ns_mailchimp input.button{
    width: 110px;
    margin: 10px 0px 0px 0px;
    }

    .squarebanner{
    padding: 0px 20px;
    }

    .squarebanner ul{
    margin:0px 0px 0px 0px;
    padding:0px 0px 10px 0px !important;

    }

    .squarebanner ul li{
    margin:10px 20px 5px 0px;
    list-style:none;
    float:left;

    }
    .squarebanner ul li img{
    width: 110px;
    height: 110px;
    }

    li.rbanner{
    margin-right:0px!important;
    }

    /* Paginate */

    .fab-paginate{
    margin-bottom: 20px;

    }

    .fab-paginate ul{
    margin: 0px 20px;
    padding: 0px;
    }

    .fab-paginate ul li{
    float: left;
    list-style: none;
    width: 30px;
    height: 30px;
    border:1px solid #ddd;
    text-align: center;
    line-height: 30px;
    margin-right: 3px;

    }

    .fab-paginate ul li.active{
    background: #444;
    border:1px solid #333;
    color: #fff;
    }
    .fab-paginate ul li a{
    display: block;
    }

    /* 404 */

    .not-page-content{
    width: 960px;
    margin: 200px auto;
    text-align: center;
    color: #fff;
    text-shadow: 2px 2px 5px #000;
    text-transform: uppercase;
    }

    .not-page-content h2{
    font-size: 120px;
    }

    .not-page-content p{
    font-size: 24px;
    }

    /* Comments */

    #comments{
    padding: 0px 20px;
    }

    h2.comments-title{
    font-size: 18px;
    margin-bottom: 30px;
    border-bottom: 2px solid #333;
    padding-bottom: 20px;
    }

    #comments ol.comment-list {
    clear: both;
    overflow: hidden;
    list-style: none;
    margin: 0;
    }

    #comments ol.comment-list li.comment,#comments ol.comment-list li.pingback {
    margin: 0px 0px 10px 0px;
    padding: 0px 0px;
    line-height: 1.6;

    }

    ol.comment-list li .comment-author .avatar {
    margin: 10px 10px 20px 0px;
    float:left;
    padding: 4px;
    border:1px solid #eee;
    }

    cite.fn {
    color: #444;
    font-style:normal;
    font-weight:bold;
    font-size:14px;
    padding-top: 10px;
    display: inline-block;
    }

    cite.fn a:link,cite.fn a:visited {
    color:#444;
    }

    ol.comment-list li .comment-meta{

    padding-bottom: 10px;
    }

    ol.comment-list li .comment-meta a {

    text-decoration: none!important;

    }

    .comment-metadata{
    font-size: 12px;
    color: #999;
    }

    .comment-metadata a:link, .comment-metadata a:visited{
    color: #999;
    }

    .comment-content{
    padding: 0px 10px 10px 50px;

    }

    ol.comment-list li .reply {
    color: #fff;
    font-size: 12px;
    margin-left: 50px;

    }

    ol.comment-list li .reply a {
    color: #fff;
    background: #444;
    padding: 5px 10px;
    }

    .space{
    height:30px;
    }

    ol.comment-list li ul.children {
    list-style: none;
    text-indent: 0;
    margin: 20px 0px 0px 50px;
    }

    #respond {
    margin: 30px 0;

    }

    #respond h3 {
    font-size: 18px;
    color: #3a4755;
    padding: 5px 0px;
    margin:0px 0px;
    }

    #commentform {
    padding: 0px 0px;
    }

    #commentform p {
    color: #777;
    margin: 5px 0;
    }

    .form-allowed-tags{
    font-size:13px;
    }

    #respond label {
    display:inline;
    color: #777;
    padding: 5px 0;
    }

    #respond input {
    background: #fff;
    border: 1px solid #ddd;
    color: #777;
    margin: 0 10px 10px 0;
    padding: 5px;
    }

    #commentform input {
    width: 50%;
    display:block;
    margin-top:5px;
    }

    #respond input#submit {
    width:130px;
    background:#eee;
    color: #555;
    cursor: pointer;
    margin: 10px 0;
    padding: 5px 10px;
    border: 1px solid #bbb;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    }

    textarea#comment {
    display:block;
    margin-top:5px;
    background: #fff;
    border: 1px solid #ddd;
    width: 70%;
    color: #333;
    margin: 5px 0 0;
    padding: 10px 10px;
    }

    .form-allowed-tags{
    padding:20px 0px;

    }

    /* Footer */

    .site-footer{
    background: #000;
    padding: 5px 10px;
    color: #777;
    font-size: 12px;
    line-height: 1.2;
    position: fixed;
    z-index: 1100;
    bottom: 0px;
    width: 100%;
    }

    .site-footer a:link, .site-footer a:visited{
    color: #777;
    }

3 reacties aan het bekijken - 1 tot 3 (van in totaal 3)
  • Sorry, je vraag is me wat onduidelijk.

    1. wat is de huidige situatie
    2. wat wil je bereiken [geef zo mogelijk een voorbeeld[-site]
    3. waar loop je vast

    FYI: het is NIET nodig je CSS-bestand te posten 😉 daar zijn tools voor…

    Thread starter Exclusiveskins

    (@exclusiveskins)

    Op mijn homepage wil ik een achtergrond video
    Dit lukt NIET op standaard sjabloon( zwarte achtegrond)
    Niet op template fullpage ( niks)
    Niet op full widht ( niks)
    Mijn thema is twenty fifteen( heeft die een I frame btw)

    Ik gebruik JWT Player voor background videos.
    Het rare is bij aanpassingen maken in het thema laat hij hetwel zien!
    mijn site is exclusivesins.com

    >> Controleer eens of de ‘z-index’ van de video-achtergrond goed staat.

    Toelichting:
    de z-index heeft een waarde van 1 – 99999999999999999
    Hoe hoger de waarde hoe meer op de voorgrond een element wordt geplaatst.
    Zorg dus dat de achtergrond een lage waarde heeft
    zorg dat je video een hogere waarde heeft [anders verdwijnt hij achter de achtergrond]
    zorg dat bijv. de inhoud van je pagina de hoogste waarde heeft

3 reacties aan het bekijken - 1 tot 3 (van in totaal 3)
  • Het onderwerp ‘PAGINA kleur aanpassen in Style Sheet’ is gesloten voor nieuwe reacties.