コンテンツ部分の両サイドに影を付けるにはどうすればよいでしょうか。

具体的には下記のサイトのように、




ページの両サイドに少し黒っぽい影のような色をつけたいのですが、CSSやHTMLの基礎レベルを習得したばかりで、やり方がわかりません。

何かコツがあれば是非教えてください！

よろしくお願いします。

これ、イメージで書いてあると思いますよ。

たとえば、grouptubeの場合、イメージはこれ。


これを改造して、使う様にすれば
たぶん、出来ますね。

がんばってください。

画像処理ソフトはお持ちでしょうか。
参考URLのサイトの画像のような影を作成するには、Photoshop（Elements,LEでも）をお持ちだと手持ちの画像で簡単に作れます（レイヤースタイルでドロップシャドウを選択する）。
簡単な影でよろしければ、画像処理ソフトで影を描いてみてはいかがでしょうか。

手持ちになくて、OSがWindowsでしたら、「ドロップシャドウイン」というフリーソフトが便利かもしれません。


CSSで影を追加する場合は
1.影用の画像を用意して画像の下にレイヤーで表示する（ただし、影を付ける前の画像のサイズに合わせる必要がある）


2.もっと単純に「border-left: 色 ○px solid;」などで指定する（ただし不透明で表示される）

3.Win OSのInternet Explorerでしか適用されないが、filterプロパティで指定する（DropShadowだと影がはっきりしすぎるので、Shadowの方がそれっぽくなるかも）。