複数画像を表示させたとき枠組みの色がかわらない。

複数画像を表示させたとき枠組みの色がかわらない。
thumbnailsで枠組みの色を指定したはずなのですが色がかわりません。
よろしくお願いします。

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="utf-8">
5    <title></title>
6    <style>
7    	body{
8    		margin: 10px auto;
9    		text-align: center;
10    	}
11    	.thumbnails{
12    		width: 205px;
13    		height: 103px;
14    		border: 10;
15    		border-color: blue;
16    	}
17    	
18    </style>
19</head>
20<body>
21	<div id="thumbnails"></div>
22    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
23    <script>
24    	$(function(){
25    		var files=[
26    			'test1.png',
27    			'test2.png',
28    			'test3.png',
29    			'test4.png',
30    		];
31    		var img;
32    		for(var i=0;i<files.length;i++){
33    			img= $('<img>').attr('src',files[i]).addClass('thumbnails');
34    		$('#thumbnails').append(img);
35    		}
36    	});
37    </script>
38</body>
39</html>
40

行動規範の内容に同意します

回答2件

こちらが原因かと思います。

css
1.thumbnails{
2            width: 205px;
3            height: 103px;
4            border: 10px; /* 枠の太さには単位が必要です。 */
5            border-color: blue;
6}

#追記
失礼、border-styleもないですね…
borderは一度にこういう感じで指定します。

css
1.thumbnails{
2            width: 205px;
3            height: 103px;
4            border: 10px solid blue;
5}

投稿2016/10/11 09:51

編集2016/10/11 09:56

gin

総合スコア2722

ベストアンサー

borderプロパティの使い方が間違っています。

css
1border: solid 10px

で枠線は引けます。太さは調整して下さい。

投稿2016/10/11 09:54

編集2016/10/11 09:56

tenu530

総合スコア49

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

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

ただいまの回答率
85.48%

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

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

質問する

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

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

複数画像を表示させたとき枠組みの色がかわらない。

関連した質問