タブでcssがエラー

前提・実現したいこと

HTMLでタブを作成しようとしたところなんですがcssが反映せずconsole.log試してみたらエラーが起きました。

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

該当のソースコード

css
1.tab {
2width:500px;    
3}
4.tab-nav{
5    display: flex;
6}
7.tab-nav-item {
8    background: #ccc;
9    color: #000;
10    padding: 10px 20px;
11    text-decoration: none;
12    border-radius: 5px 5px 0 0;
13}     
14.tab-contents{
15    border: 1px　solid #ccc;
16    padding: 20px;
17}

html
1<!doctype html>
2<html>
3    <head>
4        <meta charset="utf-8">
5        <link rel="stylesheet"href="tab.css">
6   
7    </head>
8        <body>
9       <div class="tab">
10           <a href="" clas="tab-nav-item">Tab-0</a>
11           <a href="" clas="tab-nav-item">Tab-1</a>
12           <a href="" clas="tab-nav-item">Tab-2</a>
13        </div>
14   <div class="tab-contents">
15　　<div class="tab-contents-item">
16タブその0   
17　　</div>
18    <div class="tab-contents-item">
19    タブその1
20    </div>
21    <div class="tab-contents-item">
22    タブその2
23    </div>
24</div>
25   </div>
26  
27
28</body>
29            
30
31    </html>

試したこと

ここに問題に対して試したことを記載してください。
vscoodeの確認、gogleで解決法の検索

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

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

maisumakun

2021/04/05 06:51

波線にマウスを乗せる、あるいはコンソールタブを開くなどで、どのようなエラーメッセージが出ているかは確認してみましたか？

hanpan

2021/04/05 07:08

Uncaught SyntaxError: Unexpected token '.' このメッセージが出ました

K_3578

2021/04/05 07:26

そのままGoogle翻訳掛けるなりしてみたらいかが？後このエラーとは関係ないけど <a href="" clas="tab-nav-item">Tab-0</a> <a href="" clas="tab-nav-item">Tab-1</a> <a href="" clas="tab-nav-item">Tab-2</a> これのclas属性って何だ？class属性じゃないの?