🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
HTML

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

CSS

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

Q&A

1回答

2387閲覧

.tabs-menu aの指している場所が分からない

syun0728

総合スコア6

HTML

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

CSS

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

0グッド

1クリップ

投稿2019/09/06 06:01

html

1コード<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <meta charset="utf-8"> 5 <title>jQuery テスト</title> 6 <link rel="stylesheet" href="main.css"> 7 </head> 8 <body> 9 <ul class="tabs-menu"> 10 <li><a href="#tabs-1">タブ1</a></li> 11 <li><a href="#tabs-2">タブ2</a></li> 12 <li><a href="#tabs-3">タブ3</a></li> 13 </ul> 14 <section class="tabs-content"> 15 <section id="tabs-1"> 16 <p>タブ1の内容が入ります。</p> 17 </section> 18 <section id="tabs-2"> 19 <p>タブ2の内容が入ります。</p> 20 </section> 21 <section id="tabs-3"> 22 <p>タブ3の内容が入ります。</p> 23 </section> 24 </section> 25 26 <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> 27 <script src="main.js"></script> 28 </body> 29</html>

css

1コードbody { 2 color: #3F4548; 3} 4 5 /* ulのデフォルトスタイルを消去 */ 6.tabs-menu { 7 margin: 0; 8 padding: 0; 9 list-style-type: none; 10} 11 12/* タブの基本スタイル */ 13.tabs-menu li { 14 float: left; 15 margin-right: 8px; 16 margin-bottom: -1px; 17 border-style: solid; 18 border-width: 1px; 19 border-color: transparent; 20 border-radius: 4px 4px 0 0; 21 22 /* 各プロパティをふわっと変える演出 */ 23 transition: all .15s; 24} 25.tabs-menu a { 26 display: block; 27 padding: 10px 20px; 28 color: #557F95; 29 text-decoration: none; 30} 31 32/* 非選択のタブにマウスを乗せたら色を変える */ 33.tabs-menu li:not(.active):hover { 34 border-color: #f0f0f0 #f0f0f0 #999; 35 background-color: #f0f0f0; 36} 37 38/* 選択中のタブ */ 39.tabs-menu .active { 40 border-color: #999 #999 transparent #999; 41 background-color: #fff; 42} 43.tabs-menu .active a { 44 color: #3F4548; 45} 46 47/* タブコンテンツ表示エリア */ 48.tabs-content { 49 clear: both; 50 border: 1px solid #999; 51 border-radius: 0 4px 4px 4px; 52 padding: 10px; 53} 54 55/* 各タブのコンテンツはデフォルトで非表示 */ 56.tabs-content section { 57 display: none; 58}

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
(例)PHP(CakePHP)で●●なシステムを作っています。
■■な機能を実装中に以下のエラーメッセージが発生しました。

発生している問題・エラーメッセージ

tabs-menu a{の指しているhtmlの場所を知りたいです。

エラーメッセージ

該当のソースコード

css

1ソースコード.tabs-menu a { 2 display: block; 3 padding: 10px 20px; 4 color: #557F95; 5 text-decoration: none; 6}> 引用テキスト

試したこと

ここに問題に対して試したことを記載してください。

補足情報(FW/ツールのバージョンなど)

ここにより詳細な情報を記載してください。

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

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

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

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

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

maisumakun

2019/09/06 06:06 編集

少し前に同様の質問を複数されているようですが、そちらとの違いはなにかありますでしょうか(既存の質問についた回答でわからなかったのであれば、そちらに書き足すほうが適当かと思います)。
syun0728

2019/09/06 06:07

同じ質問はしていません。
guest

回答1

0

投稿2019/09/06 06:08

maisumakun

総合スコア145967

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

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

m.ts10806

2019/09/06 06:16

削除できなくなるので回答にしなくてもよかったんでは・・・(質問者の反応に何となくイラっとくるのは分かりますが)
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

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

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

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

ただいまの回答率
85.36%

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

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

質問する

関連した質問