質問編集履歴

2

Chromeのバージョン、OSの追記

2020/06/02 00:40

投稿

matahiro
matahiro

スコア7

test CHANGED
File without changes
test CHANGED
@@ -1,3 +1,7 @@
1
+ (使用しているChromeのバージョンは83.0.4103.61(Official Build)、OSはWindows10です。)
2
+
3
+
4
+
1
5
  selectタグとoptionタグにてプルダウンメニューの作成を行おうと考えております。
2
6
 
3
7
 

1

誤字を修正、質問内容の更新

2020/06/02 00:39

投稿

matahiro
matahiro

スコア7

test CHANGED
@@ -1 +1 @@
1
- crhomにて、selectをフォーカスした際に表示されるshadowの消し方
1
+ Google Chromeにて、selectをフォーカスした際に表示されるshadowの消し方
test CHANGED
@@ -4,29 +4,29 @@
4
4
 
5
5
  ブラウザ間での挙動の違いを極力なくしたく、
6
6
 
7
- crhomeでメニューを表示した際に付くメニュー下のshadowをなくしたいと考えております。
7
+ Google Chromeでメニューを表示した際に付くプルダウンメニュー下のshadowをなくしたいと考えております。
8
8
 
9
9
  (下記画像の赤斜線部分)
10
10
 
11
- ![イメージ説明](53604fd7eb8fe4740586be561abcdf50.png)![イメージ説明](98e7e3487a78a4cc7f43be0511363f6a.png)
11
+ ![イメージ説明](7e079ff38b113d60f3ee5e8d4c936666.png)
12
12
 
13
13
 
14
14
 
15
15
 
16
16
 
17
- 対処方法を検索し、下記のことついは確認しているのですが、
17
+ 対処方法を検索し、CSSにて「outline:none;」「appearance:none;」「box-shadow:none;」
18
18
 
19
- 一番上(「item1V」の部分)の太線くなるのみとなっており、
19
+ を試しているのですが、起こる変化としては最(「item1」の部分)の枠線が太線なるか否か
20
20
 
21
- shadowは掛かったままになっておりま
21
+ 変化しかなく、赤斜線部分のshadowを消去することが出来ておりません
22
22
 
23
23
 
24
24
 
25
- shadowを消す方法があればぜひご教示いただきたいです。
25
+ プルダウンで表示される部分のshadowを消す方法があればぜひご教示いただきたいです。
26
26
 
27
27
 
28
28
 
29
- また、crhomeの性質上、shadowがかかることは避けられないという場合でも、
29
+ また、Google Chromeの性質上、shadowがかかることは避けられないという場合でも、
30
30
 
31
31
  その旨をご教示いただけると幸いです。
32
32
 
@@ -38,7 +38,7 @@
38
38
 
39
39
  【HTML】
40
40
 
41
- ```ここに言語を入力
41
+ ```
42
42
 
43
43
  <!doctype html>
44
44
 
@@ -49,8 +49,6 @@
49
49
  <meta charset="utf-8">
50
50
 
51
51
  <title>無題ドキュメント</title>
52
-
53
- <link rel="stylesheet" href="sample3.css">
54
52
 
55
53
  </head>
56
54
 
@@ -75,49 +73,3 @@
75
73
  </html>
76
74
 
77
75
  ```
78
-
79
-
80
-
81
- 【試したいこと(CSS)】
82
-
83
- ```
84
-
85
- /*1つ目*/
86
-
87
- select, select:focus {
88
-
89
- outline: none;
90
-
91
- box-shadow: none;
92
-
93
- }
94
-
95
-
96
-
97
- /*2つ目*/
98
-
99
- select:focus-visible {
100
-
101
- outline: none;
102
-
103
- box-shadow: none;
104
-
105
- }
106
-
107
-
108
-
109
- /*3つ目*/
110
-
111
- select, select:focus {
112
-
113
- -webkit-appearance: none;
114
-
115
- -moz-appearance: none;
116
-
117
- appearance: none;
118
-
119
- }
120
-
121
-
122
-
123
- ```