0
私はインストラクターの情報を表示するdivがあります。ユーザー名または画像をクリックすると、ユーザーは講師のページに移動します。しかし、インストラクターの写真の上にカーソルを置くと、青い線が現れ、漏れたリンク情報のセクション全体があることに気付きました。漏洩したリンクの内容つまり私のウェブサイトで自分のプロフィール写真のリンクが漏れているのはなぜですか？
の
/* clear settings */
body {
padding: 0;
margin: 0;
background: white;
}
/* end of clear settings */
/* nav */
#nav {
width: 1600px;
height: 50px;
background: #009ACD;
}
/* end of nav */
/* info nav */
#primary_nav_wrap {
width: 1600px;
height: 50px;
background: #1F1F1F;
}
#primary_nav_wrap ul {
list-style: none;
position: relative;
float: left;
margin: 0;
padding: 0;
left: 3%;
top: 5px;
}
#primary_nav_wrap ul a {
display: block;
text-decoration: none;
font-size: 15px;
padding: 10px 15px 10px 15px;
font-family: 'Open Sans', sans-serif;
color: white;
}
#primary_nav_wrap ul a:hover {
background: white;
}
#primary_nav_wrap ul li {
position: relative;
float: left;
margin: 0;
padding: 0;
}
#primary_nav_wrap ul li:hover a {
color: black;
background: white;
}
#primary_nav_wrap ul li a:hover {
background: white;
}
#primary_nav_wrap ul ul li a:hover {
background: #F4F4F4;
}
#primary_nav_wrap ul ul {
display: none;
position: absolute;
top: 100%;
left: 0;
background: #fff;
padding: 0;
margin-top: 0.2px;
border: 1px solid #ccc;
border-top: none;
z-index: 50;
}
#primary_nav_wrap ul ul li {
float: none;
width: 200px;
position: relative;
left: 0px;
}
#primary_nav_wrap ul ul a {
line-height: 120%;
padding: 7.5px 9px;
}
#primary_nav_wrap ul ul ul {
top: 0;
left: 100%
}
#primary_nav_wrap ul li:hover > ul {
display: block
}
/* end of info nav */
/* courses.php */
/* course intro */
#course_body {
background: #F4F4F4;
}
#course_intro {
border: 1px solid #DDDDDD;
background: white;
width: 568px;
font-family: 'Open Sans', sans-serif;
font-size: 25px;
padding: 20px 20px 10px 20px;
position: relative;
top: 40px;
left: 50px;
}
#intro_title {
width: 562px;
position: relative;
top: 2px;
}
#intro_video {
width: 375px;
height: 210px;
position: relative;
top: -7px;
}
/* end of course intro */
/* course facts */
#course_facts {
border: 1px solid #DDDDDD;
background: white;
width: 568px;
font-family: 'Open Sans', sans-serif;
font-size: 25px;
padding: 20px 20px 10px 20px;
position: relative;
top: -311px;
left: 750px;
font-size: 20px;
height: 115px;
}
.Rating {
position: relative;
width: 125px;
height: 25px;
top: -5px;
}
.Rating svg {
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
top: 0;
}
.Rating meter {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
position: absolute;
z-index: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #B6C2CC;
}
.Rating meter::-moz-meter-bar {
background: #FF7867;
}
.Rating meter::-webkit-meter-optimum-value, .Rating meter::-webkit-meter-suboptimum-value, .Rating meter::-webkit-meter-even-less-good-value {
background: #FF7867;
}
#facts_ratings {
position: relative;
top: -6px;
text-transform: uppercase;
font-size: 14px;
word-spacing: 0;
font-weight: 600;
letter-spacing: 2px;
}
#course_length {
position: relative;
top: -57px;
left: 200px;
text-transform: uppercase;
font-size: 14px;
word-spacing: 0;
font-weight: 600;
letter-spacing: 2px;
}
#course_time {
letter-spacing: 0;
font-weight: bold;
font-size: 18px;
color: #2E3D49;
}
/* end of course facts */
/* skill level */
#course_skillText {
position: relative;
top: -84px;
left: 280px;
text-transform: uppercase;
font-size: 14px;
word-spacing: 0;
font-weight: 600;
letter-spacing: 2px;
}
.fillSquare, .emptySquare {
display: inline-block;
position: relative;
left: 80px;
}
.fillSquare {
width: 12px;
height: 12px;
background: #666;
}
.emptySquare {
width: 12px;
height: 12px;
background: #B8B8B8;
}
#skill_level {
position: relative;
left: 85px;
top: -2px;
font-size: 12px;
letter-spacing: 1px;
font-weight: normal;
color: #2E3D49;
}
/* end of skill level */
/* Wish List button */
#course_wish {
border: 1px solid #ccc;
border-radius: 3px;
font-size: 15px;
position: absolute;
width: 87px;
padding: 5px;
position: relative;
top: -65px;
cursor: pointer;
box-shadow: rgba(0,0,0,0.0980392) 0 2px 3px 0;
border-radius: 3px;
}
#empty_heart {
color: #FF827F;
}
#course_wish_text {
position: relative;
left: 5px;
}
/* End of Wish List button */
/* Teacher div */
#teacher_div {
width: 326px;
border: 1px solid #ddd;
background: white;
position: relative;
left: 1002px;
padding: 15px;
top: -280px;
}
#teacher_picture {
width: 85px;
height: 85px;
border-radius: 50%;
position: relative;
left: 120px;
top: 3px;
}
#teacher_name {
font-family: 'Open Sans', sans-serif;
font-size: 18px;
text-align: center;
position: relative;
top: -15px;
width: 325px;
}
#teacher_div a {
text-decoration: none;
color: #00698C;
}
#teacher_div a:hover {
text-decoration: underline;
}
#teacher_tagLine {
font-family: 'Open Sans', sans-serif;
font-size: 14px;
color: #999;
text-align: center;
width: 325px;
position: relative;
top: -15px;
}
/* End of Teacher div */
/* end of courses.php */<?php
require "connect.php";
?>
<!DOCTYPE html>
<html>
<head>
<title> Hacked Genius </title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css">
<link rel='stylesheet' href='main.css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
<script src='main.js'></script>
</head>
<body id='course_body'>
<!-- nav -->
<div id='nav'>
</div>
<!-- end of nav -->
<!-- info nav -->
<nav id="primary_nav_wrap">
<ul>
<li><a href="#">Development</a>
<ul>
<li><a href="#">Web Development</a></li>
<li><a href="#">Mobile Apps</a></li>
<li><a href="#">Programming Languages</a></li>
<li><a href="#">Game Development</a></li>
<li><a href="#">Databases</a></li>
<li><a href="#">Software Testing</a></li>
<li><a href="#">Software Engineering</a></li>
<li><a href="#">Development Tools</a></li>
<li><a href="#">E-Commerce</a></li>
</ul>
</li>
<li><a href="#">Business</a>
<ul>
<li><a href="#">Finance</a></li>
<li><a href="#">Entrepreneurship</a></li>
<li><a href="#">Communications</a></li>
<li><a href="#">Management</a></li>
<li><a href="#">Sales</a></li>
<li><a href="#">Strategy</a></li>
<li><a href="#">Operations</a></li>
<li><a href="#">Project Management</a></li>
<li><a href="#">Business Law</a></li>
<li><a href="#">Data and Anylytics</a></li>
<li><a href="#">Home Business</a></li>
<li><a href="#">Human Resources</a></li>
<li><a href="#">Industry</a></li>
<li><a href="#">Media</a></li>
<li><a href="#">Real Estate</a></li>
<li><a href="#">Other</a></li>
</ul>
</li>
<li><a href="#">IT & Software</a>
<ul>
<li class="dir"><a href="#">IT Certification</a></li>
<li class="dir"><a href="#">Network & Security</a>
<li><a href="#">Hardware</a></li>
<li><a href="#">Operating Systems</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Office Productivity</a>
<ul>
<li class="dir"><a href="#">Microsoft</a></li>
<li class="dir"><a href="#">Apple</a>
<li><a href="#">Google</a></li>
<li><a href="#">SAP</a></li>
<li><a href="#">Intuit</a></li>
<li><a href="#">Salesforce</a></li>
<li><a href="#">Oracle</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Personal Development</a>
<ul>
<li class="dir"><a href="#">Personal Transformation</a></li>
<li class="dir"><a href="#">Productivity</a>
<li><a href="#">Leadership</a></li>
<li><a href="#">Personal Finance</a></li>
<li><a href="#">Career Development</a></li>
<li><a href="#">Parenting & Relationships</a></li>
<li><a href="#">Happiness</a></li>
<li><a href="#">Religion & Spirituality</a></li>
<li><a href="#">Personal Brand Building</a></li>
<li><a href="#">Creativity</a></li>
<li><a href="#">Influence</a></li>
<li><a href="#">Self Esteem</a></li>
<li><a href="#">Stress Management</a></li>
<li><a href="#">Memory and Study Skills</a></li>
<li><a href="#">Motivation</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Design</a>
<ul>
<li class="dir"><a href="#">Web Design</a></li>
<li class="dir"><a href="#">Graphic Design</a>
<li><a href="#">Design Tools</a></li>
<li><a href="#">User Experience</a></li>
<li><a href="#">Game Design</a></li>
<li><a href="#">Design Thinking</a></li>
<li><a href="#">3D & Animation</a></li>
<li><a href="#">Fashion</a></li>
<li><a href="#">Architectural Design</a></li>
<li><a href="#">Interior Design</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Marketing</a>
<ul>
<li class="dir"><a href="#">Digital Marketing</a></li>
<li class="dir"><a href="#">Search Engine Optimization</a>
<li><a href="#">Social Media Marketing</a></li>
<li><a href="#">Branding</a></li>
<li><a href="#">Marketing Fundamentals</a></li>
<li><a href="#">Analystics & Automation</a></li>
<li><a href="#">Public Relations</a></li>
<li><a href="#">Advertising</a></li>
<li><a href="#">Video & Mobile Marketing</a></li>
<li><a href="#">Content Marketing</a></li>
<li><a href="#">Non-Digital Marketing</a></li>
<li><a href="#">Growth Hacking</a></li>
<li><a href="#">Affiliate Marketing</a></li>
<li><a href="#">Product Marketing</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Lifestyle</a>
<ul>
<li class="dir"><a href="#">Life Hacks</a></li>
<li class="dir"><a href="#">Arts & Crafts</a></li>
<li class="dir"><a href="#">Food & Beverage</a>
<li><a href="#">Beauty & Makeup</a></li>
<li><a href="#">Travel</a></li>
<li><a href="#">Gaming</a></li>
<li><a href="#">Home Improvement</a></li>
<li><a href="#">Pet Care & Training</a></li>
</ul>
<li><a href="#">Photography</a>
<ul>
<li class="dir"><a href="#">Digital Photography</a></li>
<li class="dir"><a href="#">Photography Fundamentals</a></li>
<li class="dir"><a href="#">Portraits</a>
<li><a href="#">Landscape</a></li>
<li><a href="#">Black & White</a></li>
<li><a href="#">Photography Tools</a></li>
<li><a href="#">Mobile Photography</a></li>
<li><a href="#">Travel Photography</a></li>
<li><a href="#">Commercial Photography</a></li>
<li><a href="#">Wedding Photography</a></li>
<li><a href="#">Video Design</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Health & Fitness</a>
<ul>
<li class="dir"><a href="#">Fitness</a></li>
<li class="dir"><a href="#">General Health</a></li>
<li class="dir"><a href="#">Sports</a>
<li><a href="#">Nutrition</a></li>
<li><a href="#">Yoga</a></li>
<li><a href="#">Mental Health</a></li>
<li><a href="#">Dieting</a></li>
<li><a href="#">Self Defense</a></li>
<li><a href="#">Safety & First Aid</a></li>
<li><a href="#">Dance</a></li>
<li><a href="#">Meditation</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Language</a>
<ul>
<li class="dir"><a href="#">English</a></li>
<li class="dir"><a href="#">Spanish</a></li>
<li class="dir"><a href="#">German</a>
<li><a href="#">French</a></li>
<li><a href="#">Japanese</a></li>
<li><a href="#">Portuguese</a></li>
<li><a href="#">Chinese</a></li>
<li><a href="#">Russian</a></li>
<li><a href="#">Latin</a></li>
<li><a href="#">Arabic</a></li>
<li><a href="#">Hebrew</a></li>
<li><a href="#">Italian</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Music</a>
<ul>
<li class="dir"><a href="#">Instruments</a></li>
<li class="dir"><a href="#">Production</a></li>
<li class="dir"><a href="#">Music Fundamentals</a>
<li><a href="#">Vocal</a></li>
<li><a href="#">Music Techniques</a></li>
<li><a href="#">Music Software</a></li>
<li><a href="#">Other</a></li>
</ul>
<li><a href="#">Academics</a>
<ul>
<li class="dir"><a href="#">Social Science</a></li>
<li class="dir"><a href="#">Math & Science</a></li>
<li class="dir"><a href="#">Humanities</a>
</ul>
</ul>
</nav>
<!-- end of info nav -->
<!-- Course Introduction -->
<div id='course_intro'>
<div id='intro_title'>
Lifestyle Business: eBay Drop Shipping Guide Work from Home </div> <br>
<video src='one.mp4' poster='https://udemy-images.udemy.com/course/480x270/498972_df27_2.jpg' id='intro_video'controls></video>
</div>
<!-- End of Course Introduction -->
<!-- Course Facts -->
<div id='course_facts'>
<!-- Star Ratings -->
<span id='facts_ratings'> 400 Ratings </span>
<div class="Rating">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 100">
<defs>
<path id="a" d="M0 0h500v100H0V0zm50 79L20.6 94.5l5.6-32.8L2.4 38.5l33-4.7L50 4l14.7 29.8 33 4.7-24 23.2 5.7 32.8L50 79zm100 0l-29.4 15.5 5.6-32.8-23.8-23.2 33-4.7L150 4l14.7 29.8 33 4.7-24 23.2 5.7 32.8L150 79zm100 0l-29.4 15.5 5.6-32.8-23.8-23.2 33-4.7L250 4l14.7 29.8 33 4.7-24 23.2 5.7 32.8L250 79zm100 0l-29.4 15.5 5.6-32.8-23.8-23.2 33-4.7L350 4l14.7 29.8 33 4.7-24 23.2 5.7 32.8L350 79zm100 0l-29.4 15.5 5.6-32.8-23.8-23.2 33-4.7L450 4l14.7 29.8 33 4.7-24 23.2 5.7 32.8L450 79z"/>
</defs>
<use fill="white" fill-rule="evenodd" xlink:href="#a"/>
</svg>
<meter min="0" max="5" value="1.73"></meter>
</div>
<!-- End of Star Ratings -->
<!-- Length -->
<span id='course_length'> Length <br> <span id='course_time'> 6 Weeks </span> </span>
<!-- End of Length -->
<!-- Skill Level -->
<span id='course_skillText'> Skill Level <br> <span id='course_skill'>
<!-- Skill Boxes -->
<div class='fillSquare'></div> <div class='fillSquare'></div> <div class='emptySquare'></div>
<!-- End of Skill Boxes -->
<span id='skill_level'> Intermediate </span>
</span> </span>
<!-- End of Skill Level -->
<!-- Wish List Button -->
<div id='course_wish'> <i class="fa fa-heart-o" aria-hidden="true" id='empty_heart'></i> <span id='course_wish_text'> Wish List </span> </div>
<!-- End of Wish List Button -->
</div>
<!-- End of Course Facts -->
<!-- Teacher Div -->
<div id='teacher_div'>
<a href='#'> <img src='https://cdnil1.fiverrcdn.com/photos/127528/original/ME2014_small.jpg?1381882191' id='teacher_picture'> </a>
<br> <br> <a href='#'> <div id='teacher_name'> Matthew Malan </div> </a>
<div id='teacher_tagLine'> Game Maker, Game Designer, Game Maker User and Teacher </div>
</div>
<!-- End of Teacher Div -->スクリーンショットあなたは、この特定のセクションの上にマウスを置く場合は、リンクがあります。これは間違いです。私はインストラクターの名前とその写真のリンクが必要です。 このエラーを修正するにはどうすればよいですか？
SIDE注：何らかの理由で、スタックオーバーフローエディタで「スキルレベル」の位置付けとウィッシュリストボタンの配置が正しく行われていません。これらのエラーは、どのようにしてリークするリンクにも関係しません。
実際のURLを提供できますか？エラーを再現できません。 – Tico
@Ticoこのウェブサイトはまだ開始していません。エラーを再現するには、インストラクターの写真の上にマウスを置くだけです。あなたは左の青い線が現れるでしょう... –
胡、何も見ません:( – Tico