load-default-image-not.html

<!DOCTYPE html>
<html
  xmlns="http://www.w3.org/1999/xhtml"
  lang="ja"
  xml:lang="ja"
  dir="ltr"
  xmlns:og="http://ogp.me/ns#"
  xmlns:fb="http://www.facebook.com/2008/fbml"
>
  <head>
    <title>Responsive Grid Image</title>
    <style type="text/css">
      img:before {
        content: " ";
        display: block;
        position: absolute;
        left: 0;
        height: 41px;
        width: 95px;
        background-color: white;
        background-image: url("./images/1.jpg");
      }
    </style>
  </head>

  <body>
    <img src="./images/2.jpg" />

    <script>
        function foo(){
            if(true){
              var fruit1 = 'apple';        //exist in function scope
                const fruit2 = 'banana';     //exist in block scope
                let fruit3 = 'strawberry';   //exist in block scope
              if(true) {
                console.log(fruit2);
              }
              
              
            }
            console.log(fruit1);
            // console.log(fruit2);
            console.log(fruit3);
        }

        foo();
        //result:

      </script>
  </body>
</html>