質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
GitHub

GitHubは、Gitバージョン管理システムを利用したソフトウェア開発向けの共有ウェブサービスです。GitHub商用プランおよびオープンソースプロジェクト向けの無料アカウントを提供しています。

Q&A

0回答

728閲覧

GithubのWebページ公開について

rara0210

総合スコア18

GitHub

GitHubは、Gitバージョン管理システムを利用したソフトウェア開発向けの共有ウェブサービスです。GitHub商用プランおよびオープンソースプロジェクト向けの無料アカウントを提供しています。

0グッド

0クリップ

投稿2020/10/05 12:13

編集2020/10/05 15:49

URLを取得しようと思い、Githubを利用しようとしましたが、cssが所々反映されません。
例えば、上から三つ目/NEWS/コメントの.list-newsや、上から4つ目/NEWS2/の.warpなど。

反映されるところとされないところの差はなんでしょうか?
CSS

html, body, ul, ol, li, h1, h2, h3, h4, h5, h6, p, form, input, div { margin: 0; padding: 0; } body { font-family: "Avenir Next", "Hiragino Kaku Gothic ProN W3", sans-serif; } li { list-style: none; } a { text-decoration: none; } /*cssコード*/ header { text-align: center; background-color: black; } .head-menu a:link { color: gray; } .head-menu a:visited { color: gray; } .head-menu a:hover { color: white; text-decoration: underline; text-decoration-color: red; } .head-menu { padding-top: 20px; } .head-menu li{ color: white; display: inline; margin: 0 50px; } .head-img img { width: 100%; } .head-img { position: relative; } .disney-img { position: absolute; top: 190px; left: 90px; } .disney-txt { color: white; position: absolute; top: 370px; left: 90px; } /*youtube(wannda)*/ .wanda { height: 540px; width: 1195px; margin: 0 auto; border: solid 2px #DDDDDD; } .wanda-txt { float: left; width: 270px; padding-left: 30px; } .wanda-txt h2 { font-weight: normal; padding-bottom: 20px; } .wanda-txt p{ font-size: 90%; color: #999999; } iframe { float: right; } /*NEWS*/ .news { padding-bottom: 60px; } .news h1 { font-weight: normal; text-align: center; padding-top: 20px; letter-spacing: 0.1em; } .list-news a:link { color: black; } .list-news a:visited { color: black; } .list-news a:hover { text-decoration: underline; text-decoration-color: black; } .list-news { display: flex;   flex-flow: wrap;   width: 1190px;   margin: 0 auto; } .list-news li { width: 50%; } .flex-txt { font-size: 120%; display: flex; padding-bottom: 15px; } /*news2*/ .list-goods a:link { color: black; } .list-goods a:visited { color: black; } .list-goods a:hover { text-decoration: underline; text-decoration-color: black; } .list-goods { display: flex;   width: 1190px;   height: 800px;   margin: 0 auto;   border: solid 2px #DDDDDD; } .warp {    display: flex;   flex-flow: wrap; } .mar-ave img { border-bottom: solid 2px #DDDDDD; } .img-ave img { border-bottom: solid 2px #DDDDDD; } .mar-ave h2 { width: 210px; margin: 0 auto; } .mar-ave p { width: 210px; margin: 0 auto; } .img-ave h2 { width: 210px; margin: 0 auto; } .img-ave p { width: 210px; margin: 0 auto; } .goods-ave img { float: left; } .goods-ave h2{ float: right; padding-right: 30px; width: 210px; margin: 0 auto; } .goods-ave p { float: right; padding-right: 30px; width: 210px; margin: 0 auto; } .find-for p { width: 280px; } .list-goods h2 { font-weight: normal; padding-top: 20px; padding-left: 30px; padding-bottom: 20px; } .list-goods p { padding-left: 30px; font-size: 90%; color: #999999; } /*cinema*/ .cinema { padding-top: 50px; width: 1190px; margin: 0 auto; display: flex; } .cinema-txt a:link { color: black; } .cinema-txt a:visited { color: black; } .cinema-txt a:hover { text-decoration: underline; text-decoration-color: black; } .cinema-txt { width: 1190px; padding-top: 20px; padding-left: 30px; border: solid 2px #DDDDDD; } .cinema-txt p { color: #999999; } .cinema-txt h3 { font-weight: bolder; } /*character*/ .character h1 { font-weight: normal; text-align: center; padding-top: 20px; letter-spacing: 0.1em; } .round > li{ list-style: none; width: 100px; margin: 0 auto; } .round{ display: flex; flex-flow: row nowrap; width: 1190px; margin: 0 auto; } .round > li > *{ display: block; vertical-align: middle; } .round p { word-break: break-all; color: #999999; text-align: center!important; } .round img { border-radius: 50%; width: 100px; height: 100px; } /*キャラクター一覧*/ .blue-btn { width: 1190px; margin: 0 auto; padding-top: 10px; } .btn-flat-border {     float: right; display: inline-block; padding: 0.2em 1em; text-decoration: none; color: #67c5ff; border: solid 2px #67c5ff; border-radius: 8px; transition: .4s; } .btn-flat-border:hover { background: #67c5ff; color: white; } /*item*/ .item h1 { clear: right; font-weight: normal; text-align: center; padding-top: 20px; letter-spacing: 0.1em; } .flex { clear: right; width: 1190px; margin: 0 auto; padding: 2.5% 0; display: flex; justify-content: center; } .flex p { width: 210px; margin: 0 auto; } .flex > * { padding: 0 40px; } .flex li { border: solid 2px #DDDDDD; } .flex a:link { color: black; } .flex a:visited { color: black; } .flex a:hover { text-decoration: underline; text-decoration-color: black; } /*SNS*/ .sns-width { width: 1190px; margin: 0 auto; } .sns { float: right; padding-top: 11px; padding-right: 20px; color: #666666; font-size: 80%; } /*一覧*/ .sns-btn { width: 1190px; margin: 0 auto; } .btn-list { float: right; display: inline-block; padding: 0.1em 0.5em; text-decoration: none; color: #67c5ff; border: solid 2px #67c5ff; border-radius: 8px; transition: .4s; margin-top: 3px; } .btn-list:hover { background: #67c5ff; color: white; } /* ボタン全体 */ .flowbtn5{ font-family:'Times New Roman',sans-serif; border-radius:13px; position:relative; display:inline-block; width:37px; height:37px; font-size:20px; color:#fff!important; transition:.5s; text-decoration:none; } /* アイコンをど真ん中に*/ .flowbtn5 i{ position:absolute; top:50%; left:50%; -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); } /* Twitter */ .fl_tw1{ background:#55acee; } /* Facebook */ .fl_fb1{ background:#3b5998; } /* YouTube */ .fl_yu1{ background:#fc0d1c; } /* Instagram紫グラデ背景色 */ .insta_btn5 { background:-webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat; background:linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat; } /* Instagramオレンジグラデ背景色 */ .insta_btn5:before{ content: ''; position:absolute; top:17px; left:-1px; width:35px; height:22px; background:-webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%); background:radial-gradient(#ffdb2c 5%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%); } /* Instagramアイコン調整 */ .insta_btn5 .fa-instagram{ font-size:23px; } /* アイコンボタンにマウスホバーした時の指定*/ .flowbtn5:hover{ -webkit-transform:translateY(-5px); -ms-transform:translateY(-5px); transform:translateY(-5px); text-decoration:none; } /* ulタグの内側余白を0にする */ ul.snsbtniti{ padding:0!important; margin-bottom: 35px; } /* アイコンボタン全体の位置 */ .snsbtniti{ display:flex; float: right; } /* アイコンボタン同士の余白調整 */ .snsbtniti li{ margin: 0 6px; text-align:center!important; } /*footer前*/ .foot-list li{ clear: both; padding-right:20px; padding-left: 20px; padding-bottom: 50px; } .foot-list { border-top: solid 2px #DDDDDD; width: 1190px; margin: 0 auto; display: flex; justify-content: center; } .foot-list a:link { color: gray; } .foot-list a:visited { color: gray; } .foot-list a:hover { color: gray; text-decoration: underline; text-decoration-color: #333333; } /*footer*/ footer { width: 100%; height: 95px; background-color: black; } footer p { width: 1190px; margin: 0 auto; display: flex; justify-content: center; font-size: 90%; color: white; padding-top: 30px; } .foot { width: 1190px; margin: 0 auto; display: flex; justify-content: center; font-size: 80%; } .foot li { padding-right: 20px; padding-left: 20px; } .foot a:link { color: white; } .foot a:visited { color: white; } .foot a:hover { color: white; text-decoration: underline; text-decoration-color: white; }gi

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

y_waiwai

2020/10/05 12:15

Githubとどういう関係があるんでしょうか
rara0210

2020/10/05 12:22

URLを作成しようと思い、Githubを利用しました。 ちなみに、css,html自体は正しく反映されます。 Githubにペーストしたら所々反映されません。
gentaro

2020/10/05 15:43

「URLを作成」とはどういう意味でしょうか?
rara0210

2020/10/05 15:48

GithubでWebページを公開しようと思ってます。 URLを取得したい?という表現になるのでしょうか。 Progateというアプリの『自分で作ったWebページをインターネット上に公開しよう!」を参照しながらやってます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問