1
在我的WordPress站点内，我的鼠标光标不会改变为指针。 它会在短时间内变化，然后变回默认光标。SCSS - 光标：指针不工作
这里是我的SCSS：
// 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 //
* {
\t margin:0;
\t padding:0;
}
body {
width:100%;
height:auto;
overflow-x:hidden;
}
// Navigation //
.navbar {
border:0;
border-radius:0;
background:$c-white;
}
nav {
\t overflow: hidden;
\t height:80px;
\t 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;
}
}
}
}
}我希望有人能帮助我走出这个..
请仅包含相关的CSS元素，您有问题以及该元素的HTML ... – DaniP
您将指针仅添加到'.thumbnail'和'.title' – Dekel
'cursor：pointer' where？我们是否应该在空白页面上检查光标？ *仅供参考：您的样式末尾有一个'}'。* –