diff --git a/public/css/gogs.css b/public/css/gogs.css
index eb5f7ad2a5..41e4be9a4c 100755
--- a/public/css/gogs.css
+++ b/public/css/gogs.css
@@ -644,7 +644,7 @@ html, body {
 }
 
 .file-content .file-body {
-    padding: 0;
+    padding: 30px 30px 50px;
     border: none;
     background-color: #FFF;
 }
@@ -654,17 +654,50 @@ html, body {
     border: none;
 }
 
-.file-content .markdown > pre > ol.linenums > li:first-child {
-    padding-top: 0;
-    margin-top: 0;
-}
-
 .file-content .file-body.file-code {
     padding: 0;
 }
 
-.file-content .file-body.file-code > pre {
+.file-content .file-body.file-code .lines-code > pre {
     border: none;
+    background: none;
+    border-left: 1px solid #ddd;
+}
+
+.file-content .file-body.file-code .lines-code ol.linenums > .active {
+    background: #ffffdd;
+}
+
+.file-content .file-body.file-code .lines-num {
+    text-align: right;
+    color: #999;
+    background: #fafafa;
+    width: 1%;
+}
+
+.file-content .file-body.file-code .lines-num span {
+    font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
+    line-height: 1.6;
+    padding: 0 8px 0 10px;
+    cursor: pointer;
+    display: block;
+    margin-top: 6px;
+    font-size: 90%;
+}
+
+.file-content .file-body.file-code .lines-num span:first-child {
+    margin-top: 0;
+}
+
+.file-content .file-body.file-code > table {
+    width: 100%;
+}
+
+.file-content .file-body.file-code > table > tbody > tr,
+.file-content .file-body.file-code > table > tbody > tr > td,
+.file-content .file-body.file-code > table {
+    border: none;
+    background: none;
 }
 
 .branch-list th, .commit-list th {
diff --git a/public/css/markdown.css b/public/css/markdown.css
index 1edc3b626c..68094867b1 100644
--- a/public/css/markdown.css
+++ b/public/css/markdown.css
@@ -111,7 +111,6 @@
   line-height: 1.6;
   overflow: auto;
   background: #f8f8f8;
-  padding: 6px 10px;
   border: 1px solid #ddd;
 }
 
@@ -120,6 +119,13 @@
 }
 
 .markdown > pre > ol.linenums {
+  list-style: none;
+  padding: 0;
+}
+
+.markdown > pre.linenums-style > ol.linenums {
+  list-style-type: decimal;
+  padding: 0 0 0 40px;
   -webkit-box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc;
   box-shadow: inset 40px 0 0 #f5f5f5, inset 41px 0 0 #ccc;
 }
@@ -142,7 +148,7 @@
   padding-bottom: 12px;
 }
 
-.markdown > pre > ol.linenums > li {
+.markdown > pre.linenums-style > ol.linenums > li {
   border-left: 1px solid #ddd;
 }
 
diff --git a/public/js/app.js b/public/js/app.js
index 12f9e7f359..93cfbc1faa 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -68,9 +68,30 @@ var Gogits = {
     Gogits.renderMarkdown = function () {
         var $md = $('.markdown');
         var $pre = $md.find('pre > code').parent();
-        $pre.addClass("prettyprint");
+        $pre.addClass('prettyprint');
         prettyPrint();
 
+        var $lineNums = $pre.parent().siblings('.lines-num');
+        if($lineNums.length > 0){
+            var nums = $pre.find('ol.linenums > li').length;
+            for(var i=0;i < nums;i++){
+                $lineNums.append('<span id="L'+i+'" rel=".L'+i+'">'+(i+1)+'</span>');
+            }
+
+            var last;
+            $(document).on('click', '.lines-num span', function(){
+                var $e = $(this);
+                console.log($e.parent().siblings('.lines-code').find('ol.linenums > ' + $e.attr('rel')));
+                console.log('ol.linenums > ' + $e.attr('rel'));
+                if(last){
+                    last.removeClass('active');
+                }
+                last = $e.parent().siblings('.lines-code').find('ol.linenums > ' + $e.attr('rel'));
+                last.addClass('active');
+                window.location.href = '#' + $e.attr('id');
+            });
+        }
+
         // Set anchor.
         var headers = {};
         $md.find('h1, h2, h3, h4, h5, h6').each(function () {
diff --git a/public/js/lib.js b/public/js/lib.js
index 2a98f27775..b9e07c0caf 100644
--- a/public/js/lib.js
+++ b/public/js/lib.js
@@ -340,7 +340,7 @@ q,"'\"`"]):d.push(["str",/^(?:'(?:[^\n\r'\\]|\\.)*(?:'|$)|"(?:[^\n\r"\\]|\\.)*(?
 s+")*(?:\\x5D|$))+/")+")")])}(b=a.types)&&g.push(["typ",b]);b=(""+a.keywords).replace(/^ | $/g,"");b.length&&g.push(["kwd",RegExp("^(?:"+b.replace(/[\s,]+/g,"|")+")\\b"),q]);d.push(["pln",/^\s+/,q," \r\n\t\u00a0"]);b="^.[^\\s\\w.$@'\"`/\\\\]*";a.regexLiterals&&(b+="(?!s*/)");g.push(["lit",/^@[$_a-z][\w$@]*/i,q],["typ",/^(?:[@_]?[A-Z]+[a-z][\w$@]*|\w+_t\b)/,q],["pln",/^[$_a-z][\w$@]*/i,q],["lit",/^(?:0x[\da-f]+|(?:\d(?:_\d+)*\d*(?:\.\d*)?|\.\d\+)(?:e[+-]?\d+)?)[a-z]*/i,q,"0123456789"],["pln",/^\\[\S\s]?/,
 q],["pun",RegExp(b),q]);return C(d,g)}function J(a,d,g){function b(a){var c=a.nodeType;if(c==1&&!x.test(a.className))if("br"===a.nodeName)s(a),a.parentNode&&a.parentNode.removeChild(a);else for(a=a.firstChild;a;a=a.nextSibling)b(a);else if((c==3||c==4)&&g){var d=a.nodeValue,i=d.match(m);if(i)c=d.substring(0,i.index),a.nodeValue=c,(d=d.substring(i.index+i[0].length))&&a.parentNode.insertBefore(j.createTextNode(d),a.nextSibling),s(a),c||a.parentNode.removeChild(a)}}function s(a){function b(a,c){var d=
 c?a.cloneNode(!1):a,e=a.parentNode;if(e){var e=b(e,1),g=a.nextSibling;e.appendChild(d);for(var i=g;i;i=g)g=i.nextSibling,e.appendChild(i)}return d}for(;!a.nextSibling;)if(a=a.parentNode,!a)return;for(var a=b(a.nextSibling,0),d;(d=a.parentNode)&&d.nodeType===1;)a=d;c.push(a)}for(var x=/(?:^|\s)nocode(?:\s|$)/,m=/\r\n?|\n/,j=a.ownerDocument,k=j.createElement("li");a.firstChild;)k.appendChild(a.firstChild);for(var c=[k],i=0;i<c.length;++i)b(c[i]);d===(d|0)&&c[0].setAttribute("value",d);var r=j.createElement("ol");
-r.className="linenums";for(var d=Math.max(0,d-1|0)||0,i=0,n=c.length;i<n;++i)k=c[i],k.className="L"+(i+d)%10,k.firstChild||k.appendChild(j.createTextNode("\u00a0")),r.appendChild(k);a.appendChild(r)}function p(a,d){for(var g=d.length;--g>=0;){var b=d[g];F.hasOwnProperty(b)?D.console&&console.warn("cannot override language handler %s",b):F[b]=a}}function I(a,d){if(!a||!F.hasOwnProperty(a))a=/^\s*</.test(d)?"default-markup":"default-code";return F[a]}function K(a){var d=a.h;try{var g=T(a.c,a.i),b=g.a;
+r.className="linenums";for(var d=Math.max(0,d-1|0)||0,i=0,n=c.length;i<n;++i)k=c[i],k.className="L"+(i+d),k.firstChild||k.appendChild(j.createTextNode("\u00a0")),r.appendChild(k);a.appendChild(r)}function p(a,d){for(var g=d.length;--g>=0;){var b=d[g];F.hasOwnProperty(b)?D.console&&console.warn("cannot override language handler %s",b):F[b]=a}}function I(a,d){if(!a||!F.hasOwnProperty(a))a=/^\s*</.test(d)?"default-markup":"default-code";return F[a]}function K(a){var d=a.h;try{var g=T(a.c,a.i),b=g.a;
 a.a=b;a.d=g.d;a.e=0;I(d,b)(a);var s=/\bMSIE\s(\d+)/.exec(navigator.userAgent),s=s&&+s[1]<=8,d=/\n/g,x=a.a,m=x.length,g=0,j=a.d,k=j.length,b=0,c=a.g,i=c.length,r=0;c[i]=m;var n,e;for(e=n=0;e<i;)c[e]!==c[e+2]?(c[n++]=c[e++],c[n++]=c[e++]):e+=2;i=n;for(e=n=0;e<i;){for(var p=c[e],w=c[e+1],t=e+2;t+2<=i&&c[t+1]===w;)t+=2;c[n++]=p;c[n++]=w;e=t}c.length=n;var f=a.c,h;if(f)h=f.style.display,f.style.display="none";try{for(;b<k;){var l=j[b+2]||m,B=c[r+2]||m,t=Math.min(l,B),A=j[b+1],G;if(A.nodeType!==1&&(G=x.substring(g,
 t))){s&&(G=G.replace(d,"\r"));A.nodeValue=G;var L=A.ownerDocument,o=L.createElement("span");o.className=c[r+1];var v=A.parentNode;v.replaceChild(o,A);o.appendChild(A);g<l&&(j[b+1]=A=L.createTextNode(x.substring(t,l)),v.insertBefore(A,o.nextSibling))}g=t;g>=l&&(b+=2);g>=B&&(r+=2)}}finally{if(f)f.style.display=h}}catch(u){D.console&&console.log(u&&u.stack||u)}}var D=window,y=["break,continue,do,else,for,if,return,while"],E=[[y,"auto,case,char,const,default,double,enum,extern,float,goto,inline,int,long,register,short,signed,sizeof,static,struct,switch,typedef,union,unsigned,void,volatile"],
 "catch,class,delete,false,import,new,operator,private,protected,public,this,throw,true,try,typeof"],M=[E,"alignof,align_union,asm,axiom,bool,concept,concept_map,const_cast,constexpr,decltype,delegate,dynamic_cast,explicit,export,friend,generic,late_check,mutable,namespace,nullptr,property,reinterpret_cast,static_assert,static_cast,template,typeid,typename,using,virtual,where"],N=[E,"abstract,assert,boolean,byte,extends,final,finally,implements,import,instanceof,interface,null,native,package,strictfp,super,synchronized,throws,transient"],
diff --git a/routers/repo/single.go b/routers/repo/single.go
index 6eb839c10d..49eb55d3e0 100644
--- a/routers/repo/single.go
+++ b/routers/repo/single.go
@@ -5,6 +5,7 @@
 package repo
 
 import (
+	"path"
 	"strings"
 
 	"github.com/codegangsta/martini"
@@ -95,6 +96,7 @@ func Single(ctx *middleware.Context, params martini.Params) {
 		} else {
 			ctx.Data["IsFile"] = true
 			ctx.Data["FileName"] = repoFile.Name
+			ctx.Data["FileExt"] = path.Ext(repoFile.Name)
 
 			readmeExist := base.IsMarkdownFile(repoFile.Name) || base.IsReadmeFile(repoFile.Name)
 			ctx.Data["ReadmeExist"] = readmeExist
diff --git a/templates/repo/single_file.tmpl b/templates/repo/single_file.tmpl
index 0c1c3713f6..7bca626aaa 100644
--- a/templates/repo/single_file.tmpl
+++ b/templates/repo/single_file.tmpl
@@ -16,8 +16,15 @@
                 {{.FileContent|str2html}}
             </div>
         {{else}}
-            <div class="panel-body file-body file-code markdown">
-                <pre class="linenums"><code>{{.FileContent}}</code></pre>
+            <div class="panel-body file-body file-code">
+                <table>
+                    <tbody>
+                        <tr>
+                            <td class="lines-num"></td>
+                            <td class="lines-code markdown"><pre class="linenums lang-{{.FileExt}}"><code>{{.FileContent}}</code></pre></td>
+                        </tr>
+                    </tbody>
+                </table>
             </div>
         {{end}}
     {{end}}