こんにちは!
お世話になります。
Javascriptの本を読んでプログラミングしてみましたが、
矢印が見えなくて困っています。
あることはあるんです。
F12キーを押して確かにグレイアウトされて存在していますし、
見えないけれども押すこともできます。
・.pngが小さすぎて上に画像が被さっているのではないかと思い200pxと大きくしてみても、見えません。
・背景画像がジャマをしているのではと思い、消してみましたが、これも効果なし。
・そもそも矢印の.pngが小さすぎるのでは?と思い、アイコンを代わりに入れてみても見えません。
どうぞ、お力添えのほど、よろしくお願いいたします。
【 HTML 】
```【 CSS 】 @charset "utf-8"; body { margin: 0; padding: 0; color: #ffffff; font-size: 15px; line-height: 2; font-family: 'Helvetica Neue','Helvetica','Avenir','Arial','Hiragino Sans','ヒラギノ角ゴシック','Yu Gothic','メイリオ','MS Pゴシック','MS PGothic'; } img{ vertical-align: bottom; } header{ width: 960px; height: 100px; margin: 0 auto; } .global-nav{ float: right; margin-top: 60px; } .global-nav li{ float: left; margin: 0 20px; font-size: 20px; list-style: none; font-family: 'Bitter', serif; } .gloval-nav li a{ color: #ffffff; } */ #wrap{ clear: both; margin-top: 50px; padding: 20px 0; } .content{ width: 960px; margin: 0 auto; } footer{ text-align: center; color: #ffffff; padding: 20px 0; background-color: transparent; } footer small{ font-size: 12px; } #index .content{ margin-top: 150px; } #lecture{ background-image: url(../images/lecture.jpg); background-repeat: no-repeat; background-position: center center; background-attachment: fixed; background-size: cover; } #lecture-example{ background-image: url(../images/lecture.jpg); background-repeat: no-repeat; background-position: center center; background-attachment: fixed; background-size: cover; } #contact{ background-image: url(../images/keyboard.jpg); background-repeat: no-repeat; background-position: center center; background-attachment: fixed; background-size: cover; } .main-center{ width: 940px; margin: 0 auto; } h1{font-family: 'Bitter', serif; font-size: 36px; border-bottom: 1px solid #cccccc; } h2{font-family: 'Bitter', serif; font-size: 24px; } h3{font-family: 'Bitter', serif; font-size: 20px; } .icon:before{ content: ""; padding-right: 10px; border-left: 7px solid #F0E130; } #about .profile-txt{ width: 540px; float: left; } #about .profile-txt span{ font-weight: bold; } #about .profile-image{ float: left; } .clearfix:after{ content:""; display:block; clear: both; } section{ margin-bottom: 35px; } #about .career th{ width: 150px; padding: 12px 0; } #about .career td{ width: 660px; } table{ border-spacing: 0; border-collapse: collapse; } #index #wrap{ background-color: transparent; margin-top: 0; padding: 0; } a img:hover{ opacity: 0.8; } .section{ margin-right: 50px; } #contact .access table{ width: 460px; height:220px; float: left; background-color: #333333; padding: 20px 50px; opacity: 0.8; } #contact .access th, #contact .access td { text-align: left; vertical-align: top; line-height: 2.5; } #contact .access td{ padding-left: 30px; } #contact .access iframe{ width: 460px; float: right; } #contact .form{ background-color: #333333; padding: 20px 50px; } #contact .form dl dt{ width:165px; padding: 10px 0; float: left; clear: both; } #contact .form dl dd{ padding: 10px 0; } #contact .form .name{ width: 240px; height: 30px; } #contact .form .email{ width: 240px; height: 30px; } #contact .form .tel{ width: 240px; height: 30px; } #contact .form .type{ width: 240px; height: 30px; } #contact .form .message{ width: 660px; height: 150px; } #contact .form button{ background-color: #F0E130; color: #333333; font-size: 20px; font-family: 'MS Mincho'; font-weight: 600; width: 120px; display: block; text-align: center; line-height: 50px; margin-top: 20px; border-radius: 5px; border: 3px solid #F0E130; margin-left:165px; } #contact .form button:hover{ background-color: #333333; color: #F0E130; border: 3px solid #F0E130; cursor: pointer } #contact .form .required:after{ content: "*"; color: #ff0000; } #contact .form .attention{ margin: 20px 0 0 165px; } .current{ border-bottom: 4px solid #F0E130; } #about .btn{ margin: 8px 0 20px 0; } img{ max-width: 100% } .toolbar{ overflow: hidden; text-align: center; } .nav{ display: inline-block; } #prev{ float: left; width: 100px; height: 100px; background: url(images/next.png) no-repeat; } #next{ float: right; width: 100px; height: 100px; background: url(images/prev.png) no-repeat; } .slide{ margin: 50px auto; border: 1px solid #F0E130; width: 960px; height: 600px; background-color: #333333; } #lecture .section{ margin-top: 100px; }
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/04/30 09:48
2019/04/30 10:28
2019/04/30 11:01