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

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

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

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

663閲覧

意としないファイルのプロパティーが適用されている

Sakupi

総合スコア17

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2020/10/10 11:56

実現したいこと

html,cssを使って模写コーディングの練習をしています。
style.cssに記述したfont-weightプロパティを有効にしたいです。

問題点、エラーコード

style.cssファイルにfontweightプロパティーを記述しているのですが、有効になっておらず、ディベロッパーツールで確認したところ、意としないtype.scssというファイルのfontweightが適用されていました。
style.cssファイルに記述した方を適用させたかったため、!importatを追って記述しましたが、変化ありませんでした。
適用されてしまっているcss自体を変えよう!と思いましたが、
そもそも、type.scssファイルを自分では作っておらず、どこにファイルが存在しているのかもわからなかったので、何もできずにいます。。(ディベロッパーツールで確認してはじめて存在を知りました。。。)
どなたかお時間許す方、任意のファイルのプロパティーを適用させる方法を教えていただきたいです。
以下、画像は適用したいがされないcss、適用されているcssのfontweightをなぞっています↓
適用したいcss
適用したくないcss

HTML

1<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <!-- Required meta tags --> 5 <meta charset="utf-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 7 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 8 <link rel="stylesheet" href="responsive.css"> 9 10 11 <link rel="stylesheet" href="style.css"> 12 <link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet"> 13 <!-- Bootstrap CSS --> 14 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous"> 15 16 17 <title>airbnb</title> 18 </head> 19 20 <body> 21 <header> 22 <div class="header-container"> 23 <ul class="header-li"> 24 <li class="fab fa-airbnb"></li> 25 <li>概要</li> 26 <li>準備</li> 27 <li>安全</li> 28 <li>マネープラン</li> 29 </ul> 30 <button name="button" onclick="location.href='#'">はじめる</button> 31 </div> 32 </header> 33 34 <div class="top"> 35 <div class="top-box"> 36 <h1>Airbnbホストになって、暮らしをレベルアップ</h1> 37 <h2> 宿泊施設の内容を記入</h2> 38 <input class="所在地"> 39 東京 40 <input class="建物タイプ"> 41 まるまる貸切 42 <input class="ゲスト4人"> 43 ゲスト4人 44 <button class="top-button" onclick="location.href='#'" >はじめる</button> 45 </div> 46 47 </div> 48 49 50 <main> 51 <div class="main-ex"> 52 <div class="exs"> 53 <h2>Airbnbでホストするこれだけの理由</h2> 54 <p> どんなお家やお部屋でも、Airbnbなら簡単かつ安全にシェアでき、世界中の旅好きな仲間とつながれます。 予約可能日から料金、ハウスルール、ゲストとの交流程度まで、すべて自分で決めることができます。</p> 55 </div> 56 <div class="exs"> 57 <h2>困ったときも安心</h2> 58 <p> 万一に備えるUS$1,000,000の財物補償、US$1,000,000の賠償責任保険が全予約に自動付帯。ホストのみなさまと建物・家財の安全をお守りするため全力で取り組んでいます。 </p> 59 </div> 60 </div> 61 <hr> 62

css

1/* 2html5doctor.com Reset Stylesheet 3v1.6.1 4Last Updated: 2010-09-17 5Author: Richard Clark - http://richclarkdesign.com 6Twitter: @rich_clark 7*/ 8 9html, body, div, span, object, iframe, 10h1, h2, h3, h4, h5, h6, p, blockquote, pre, 11abbr, address, cite, code, 12del, dfn, em, img, ins, kbd, q, samp, 13small, strong, sub, sup, var, 14b, i, 15dl, dt, dd, ol, ul, li, 16fieldset, form, label, legend, 17table, caption, tbody, tfoot, thead, tr, th, td, 18article, aside, canvas, details, figcaption, figure, 19footer, header, hgroup, menu, nav, section, summary, 20time, mark, audio, video { 21 margin:0; 22 padding:0; 23 border:0; 24 outline:0; 25 font-size:100%; 26 vertical-align:baseline; 27 background:transparent; 28} 29 30body { 31 line-height:1; 32 font-family: Circular, -apple-system, BlinkMacSystemFont, Roboto, Helvetica Neue, sans-serif; 33} 34 35nav ul { 36 list-style:none; 37} 38 39blockquote, q { 40 quotes:none; 41} 42 43blockquote:before, blockquote:after, 44q:before, q:after { 45 content:''; 46 content:none; 47} 48 49a { 50 margin:0; 51 padding:0; 52 font-size:100%; 53 vertical-align:baseline; 54 background:transparent; 55} 56 57/* change colours to suit your needs */ 58ins { 59 background-color:#ff9; 60 color:#000; 61 text-decoration:none; 62} 63 64/* change colours to suit your needs */ 65mark { 66 background-color:#ff9; 67 color:#000; 68 font-style:italic; 69 font-weight:bold; 70} 71 72del { 73 text-decoration: line-through; 74} 75 76abbr[title], dfn[title] { 77 border-bottom:1px dotted; 78 cursor:help; 79} 80 81table { 82 border-collapse:collapse; 83 border-spacing:0; 84} 85 86/* change border colour to suit your needs */ 87hr { 88 display:block; 89 height:1px; 90 border:0; 91 border-top:1px solid #cccccc; 92 margin:1em 0; 93 padding:0; 94} 95 96input, select { 97 vertical-align:middle; 98} 99/*ここからオリジナル*/ 100*{ 101 box-sizing: border-box; 102} 103header{ 104 height: 80px; 105} 106.header-container{ 107 height: 80px; 108 display: flex; 109 flex-flow: row wrap; 110 justify-content: space-between; 111 align-items: center; 112} 113 114header ul { 115 list-style: none; 116 display: flex; 117 flex-flow: row wrap; 118 justify-content: space-around; 119 margin: 0%; 120} 121header ul li{ 122 margin: 0 17px; 123} 124li.fab.fa-airbnb { 125 font-size: 30px; 126 color: #008489; 127} 128 129button{ 130 -moz-appearance: none; 131 -webkit-appearance: none; 132 appearance: none; 133background-color: #DE1263; 134border-style: none; 135color: white; 136border-radius: 8px !important; 137padding: 10px 20px; 138} 139.top { 140 height: 677px; 141 width: 1350px; 142 margin: 0 auto; 143 border-radius: 20px; 144 background-image: url(image/photographer-865295__340.webp); 145 background-size: cover; 146 display: flex; 147 justify-content: flex-end; 148} 149.top-box{ 150 width: 938px; 151 height: 484px; 152 background-color: white; 153 margin-right: 40px; 154 margin-top: 271px; 155 border-radius: 20px; 156 box-shadow: 0px 5px 10px gainsboro; 157} 158main{ 159 width: 1033px; 160 margin: 0 auto; 161} 162.main-ex{ 163 margin-top: 145px; 164 display: flex; 165 justify-content: space-between; 166} 167.exs{ 168 width: 435px; 169 color: #484848; 170} 171.exs h2{ 172 font-style: normal; 173 font-weight: 800px !important ; 174 font-size: 24px; 175 line-height: 30px; 176 margin-bottom: 27px; 177} 178.exs p{ 179 font-size: 16px; 180 line-height: 28px; 181}

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

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

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

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

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

guest

回答1

0

自己解決

fontweightなのに間違ってpxと書いていただけでした。申し訳ありません。

投稿2020/10/10 12:31

Sakupi

総合スコア17

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.46%

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

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

質問する

関連した質問