SCSS - 游标：指针不工作

时间：2016-11-09 13:43:10

标签： css wordpress pointers sass cursor

在整个网站的wordpress中，我的鼠标光标没有变成指针。 它确实会在短时间内发生变化，然后再变回默认光标。

这是我的SCSS：

＆＃13;
＆＃13; 
// Fonts //

// Caviar Dreams //
  @font-face {
    font-family: 'caviar_dreams';
    src: url('../fonts/caviar_dreams/caviardreams_bold-webfont.woff2') format('woff2'),
    url('../fonts/caviar_dreams/caviardreams_bold-webfont.woff') format('woff');
    font-weight: 500;
    font-style: normal;
  }
  @font-face {
    font-family: 'caviar_dreams';
    src: url('../fonts/caviar_dreams/caviardreams_bolditalic-webfont.woff2') format('woff2'),
    url('../fonts/caviar_dreams/caviardreams_bolditalic-webfont.woff') format('woff');
    font-weight: 600;
    font-style: normal;
  }
  @font-face {
    font-family: 'caviar_dreams';
    src: url('../fonts/caviar_dreams/caviardreams_italic-webfont.woff2') format('woff2'),
    url('../fonts/caviar_dreams/caviardreams_italic-webfont.woff') format('woff');
    font-weight: 300;
    font-style: normal;
  }
  @font-face {
    font-family: 'caviar_dreams';
    src: url('../fonts/caviar_dreams/caviardreams-webfont.woff2') format('woff2'),
    url('../fonts/caviar_dreams/caviardreams-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
  }

// Thinking Of Betty //
  @font-face {
    font-family: 'thinking_of_betty';
    src: url('../fonts/thinking_of_betty/thinking_of_betty-webfont.woff2') format('woff2'),
    url('../fonts/thinking_of_betty/thinking_of_betty-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
  }

// Square Deal //
  @font-face {
    font-family: 'square_deal';
    src: url('../fonts/square_deal/square-deal-webfont.woff2') format('woff2'),
    url('../fonts/square_deal/square-deal-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
  }

// Barkentina //
  @font-face {
    font-family: 'barkentina';
    src: url('../fonts/barkentina/barkentina_1-webfont.woff2') format('woff2'),
    url('../fonts/barkentina/barkentina_1-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
  }

// Colors //

$c-black: #111;
$c-white: #fff;
$c-dark-brown: #b29256;
$c-light-brown: #ffd994;
$c-blue: #adfff3;
$c-light-purple: #a462cc;
$c-dark-purple: #935fb2;

// Transitions //

$transition: all ease-in-out .2s;

// Main Style //
* {
	margin:0;
	padding:0;
}
body {
  width:100%;
  height:auto;
  overflow-x:hidden;
}

// Navigation //
.navbar {
  border:0;
  border-radius:0;
  background:$c-white;
}
nav {
	overflow: hidden;
	height:80px;
	width:100%;
    z-index: 900;
    -webkit-box-shadow: 0px 8px 35px 0px rgba(0,0,0,0.22);
    ul {
      border:0;
      li {
        .menu-primary-container {
          width:100%;
          height:100%;
          background:green;
          position: absolute;
          ul {
            display:block;
            width:102%;
            margin-left:-1%;
            list-style:none;
            border:0;
            li {
              float:left;
              width:25%;
              text-align:center;
              z-index:500;
              a {
                text-decoration:none;
                text-transform:uppercase;
                color:$c-black;
                width:100%;
                padding: 4% 0;
                font-size:2em;
                font-family:caviar_dreams;
                font-weight:400;
                transition:$transition;
                display:block;
                z-index:1000;
                  &:hover {
                  color:$c-black;
                  font-size:2.2em;
                  background:$c-light-brown;
                }
              }
            }
          }
        }
      }
    }
  }

// Header //

.header {
  .overlay {
    width: 100%;
    height: 100vh;
    background: -moz-linear-gradient(-45deg,  $c-light-purple 0%, $c-blue 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  $c-light-purple 0%, $c-blue 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  $c-light-purple 0%, $c-blue 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a462cc', endColorstr='#adfff3',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    opacity:0.7;
    position:absolute;
    left:0;
    top:0;
    z-index:10;
    -webkit-box-shadow: 0 8px 35px 0 rgba(0,0,0,0.35);
  }
  .slider {
    height:93vh;
    width:100%;
    margin-top:-1.2%;
    overflow:hidden;
    z-index:5;
    .ls-slide {
      height: 100vh !important;
      img {
        height:100vh !important;
        width:auto !important;
        margin-top:0 !important;
        margin-left:-35% !important;
      }
    }
  }
  .me {
    position: absolute;
    top:-85vh;
    left:50%;
    transform:translateX(-50%);
    z-index:15;
    img {
      height:560px;
      border-radius:100%;
      -webkit-box-shadow: 0 0 35px 0 rgba(0,0,0,0.22);
    }
  }
  .title {
    position: absolute;
    top:-25vh;
    width:100%;
    text-align:center;
    font-family:thinking_of_betty;
    font-size:7.5em;
    color:$c-white;
    z-index:15;
  }
}

// Main Content //

// Spacer //

.spacer {
  width:100%;
  height:30vh;
  background:$c-white;
  img {
    display:block;
    height:200px;
    margin-top:50px;
    position: absolute;
    left:50%;
    transform:translateX(-50%);
  }
}

// Who Am I //

.whoami {
  height:100vh;
  width:100%;
  -webkit-box-shadow: 0 -8px 35px 0 rgba(0,0,0,0.35);
  .whoamibg{
    width:100%;
    height:100%;
    background-size:cover;
    position: absolute;
  }

  .overlay{
    width:100%;
    height:100%;
    position: absolute;
    background: -moz-linear-gradient(-45deg,  $c-light-purple 0%, $c-light-brown 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg,  $c-light-purple 0%, $c-light-brown 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg,  $c-light-purple 0%, $c-light-brown 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a462cc', endColorstr='#FFD994',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    opacity:0.7;
    -webkit-box-shadow: 0 8px 35px 0 rgba(0,0,0,0.35);
  }

  .title {
    position: absolute;
    width:100%;
    text-align:center;
    color:$c-white;
    font-family:thinking_of_betty;
    font-size:4em;
    margin-top:75px;
  }

  .me2 {
    img {
      height:400px;
      margin-top:100px;
      margin-left:100px;
    }
    .skills {
      background:$c-dark-purple;
      height: 40vh;
      width:314px;
      margin-left: 123px;
      margin-top: -2px;
      overflow:hidden;
      transition:$transition;
      .skill-text {
        color:white;
        font-family:caviar_dreams;
        font-size: 2.5em;
        float:none;
        width:100%;
        text-align:center;
        display:block;
        padding-top:36px;
      }
      .percent-text {
        color:white;
        font-family:caviar_dreams;
        font-size:1em;
        display:block;
        margin-top:16px;
        position:relative;
        left:-4%;
      }
      .skill-percent {
        transition:$transition;
        width:50%;
        background:$c-white;
        height:10px;
        position:absolute;
        margin-left:5%;
        margin-top:8px;
        .skillbar {
          position: absolute;
          height:100%;
          background:$c-blue;
        }
      }
    }
  }
  .story {
    color: white;
    margin-top: 260px;
    font-family: barkentina;
    font-size: 2.6em;
    text-align: center;
    width: 85%;
  }
}

// My Work //

.mywork {
  width:100%;
  height:100vh;
  background: -moz-linear-gradient(45deg,  $c-blue 0%, $c-light-brown 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(45deg,  $c-blue 0%, $c-light-brown 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(45deg,  $c-blue 0%, $c-light-brown 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ADFFF3', endColorstr='#FFD994',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

  .title {
    position: absolute;
    width:100%;
    text-align:center;
    color:$c-white;
    font-family:thinking_of_betty;
    font-size:4em;
    margin-top:75px;
    cursor:pointer;
  }
  .container {
    width:1900px;
    margin-top:300px;

    .thumbnail {
      padding:6px;
      background: -moz-linear-gradient(45deg,  $c-blue 0%, $c-light-brown 100%);
      background: -webkit-linear-gradient(45deg,  $c-blue 0%, $c-light-brown 100%);
      background: linear-gradient(45deg,  $c-blue 0%, $c-light-brown 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ADFFF3', endColorstr='#FFD994',GradientType=1 );
      -webkit-box-shadow: 0 0 35px 0 rgba(0,0,0,0.22);
      overflow:hidden;
      width: 100%;
      height: 306px;
      cursor:pointer;
      img {
        z-index:2;
      }
      .overlay {
        position: relative;
        z-index: 5;
        top: -100.6%;
        padding: 6px;
        background: rgba(255, 255, 255, 0.5);
        color: #fff;
        height: 100.5%;
        opacity:0;
        -webkit-transition: $transition;
        -moz-transition: $transition;
        -ms-transition: $transition;
        -o-transition: $transition;
        transition: $transition;
        &:hover {opacity:1;}
        .overlay_title {
          font-family:caviar_dreams;
          font-weight:500;
        }
        .stripe {
          background:$c-white;
          width:20px;
          height:2px;
        }
        .description {
          font-family:barkentina;
        }
      }
    }

  }
}
＆＃13;
＆＃13;
＆＃13;

我希望有人可以帮我解决这个问题。

1 个答案:

答案 0 :(得分：0)

您检查过生成的CSS吗？ 据我所知，实际上只有几个元素会有一个指针光标。 我相信光标变回正常只是因为它远离具有相应光标集的元素。

您是否检查过将光标更改为指针的元素？

相关问题
最新问题