제가 정확한 답변인지 모르겠으나, 제가 아는 한도내에서만 말씁드리겠습니다.는

아마도 나중에 전문가 분이 정확한 말씀을 해주지 않을까 싶네요

아래는 참고하시라고 복사해놓은 것입니다.

HTML과 css가 맞긴 한데

기본은 javascript를 이용한 솔루션으로 보여지는 책 같습니다.

솔루션 기반은 jQuery 같습니다.

즉 jQeury로 만들어진 책 내용을 보여주는 솔루션으로 보여지는 것 같습니다.

아래의 CSS 파일들은 꼭 이페이지를 위해서기 보다는 솔루션에 적용되는 CSS같습니다.

답변이 되려나 모르겠네요 ^^;

죄송합니다.

#----------------------------------------------------------------------------------------------

<link href="https://www.softcover.io/assets/reading-586c9ebceb7278df909cbc93fac719cc.css" media="screen" rel="stylesheet" type="text/css" />
<link href="https://www.softcover.io/assets/print-ca85c1c74168e935ca4e2e958a3a5c2b.css" media="print" rel="stylesheet" type="text/css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.formalize/1.2/jquery.formalize.min.js" type="text/javascript"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js" type="text/javascript"></script>
<script src="https://js.stripe.com/v1/" type="text/javascript"></script>
<script src="https://www.softcover.io/assets/application-0339c76e489575faebecbed89ac7b080.js" type="text/javascript"></script>
<meta content="authenticity_token" name="csrf-param" />
<meta content="HY2omcm51fr4T3PeejrBlJ17il4FnlUP2fs7eFuFE0g=" name="csrf-token" />
<link href="/apple-touch-icon-precomposed.png" rel="apple-touch-icon-precomposed" />
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,300italic,400italic,300,700|Open+Sans+Condensed:700|Josefin+Slab:400italic" rel="stylesheet" type="text/css" />
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet" />
<script src="https://www.google.com/jsapi" type="text/javascript"></script>
<script>
  // test key only
  // this identifies your website in the createToken call below
  Stripe.setPublishableKey('pk_live_Xn1p0BfxqKxkAxtEr03P7wmd');
</script>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  ga('require', 'linker');
  ga('linker:autoLink', ['www.railstutorial.org', 'softcover.io']);
  ga('create', 'UA-46858978-1', 'softcover.io', {'allowLinker': true});
  ga('send', 'pageview');
  ga('create', 'UA-8667566-1', 'auto', {
    'name': 'book',
    'allowLinker': true
  });
  ga('book.send', 'pageview');
</script>
<script type="text/javascript">var _sf_startpt=(new Date()).getTime()</script>
<script src="http://www.softcover.io/books/64/custom_domain_js.js" type="text/javascript"></script>

#-----------------------------------------------------------------------

고맙습니다. 그런데요.. 저 텍스트 내용은 모두 html로 존재하고 모두 다운 받아볼 수 있거든요. 그 속을 들여다 보면 그냥 class를 가지고 정의를 하고 있어서 style파일을 가지고 정의가 되어있는듯이 보입니다. 물론 style을 js속에 심어둘 수 있기는 하겠지만 말이죠.

소스상으로는, http://fontawesome.io/ 를 사용했다고 나오는군요. Github : https://github.com/FortAwesome/Font-Awesome 를 통해서 배포되고 있고, MIT license니 자유롭게 배포/사용이 가능하겠군요.