0
所以,我已经为404页面定制了设计 - 但是,我在实现它时遇到了问题。实现自定义404错误页面
我很快就了解到,您必须将CSS直接嵌入到HTML中 - 其次,它看起来不像我可以使用html.erb或嵌入式ruby换句话说。这就是说,对我来说,在我的404.html页面上实现以下设计代码的最佳方式是什么?
<!DOCTYPE html>
<html lang="en"><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link href='http://fonts.googleapis.com/css?family=Oswald:400,300,700' rel='stylesheet' type='text/css'>
<title>New Error Design</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/mystyle.css" rel="stylesheet">
<link href="css/mediaquery.css" rel="stylesheet">
<link rel="stylesheet" href="css/selectify.css" />
</head>
<body>
<header class="navbar navbar-inverse">
<div class="container">
<div class="row">
<div class="col-md-3 logo">
<a href="index.html"><img src="images/logo.png" alt="logo"></a>
</div>
<div class="col-md-3 pull-right">
<a href="sign-in.html"><button type="button" class="btn btn-info sign-i-u">Sign IN</button></a>
<a href="sign-up.html"><button type="button" class="btn btn-info sign-i-u">Sign Up</button></a>
</div>
</div>
</div>
</header>
<div class="container">
<div class="row">
<div class="col-md-12 error_text">
<h1> Sorry, the page you requested is not found</h1>
<div class="col-md-12">
<div class="col-md-6 col-md-offset-3 text-center">
<%= link_to 'sign Up', new_user_registration_path, class: "btn btn-primary buttons_style" %>
<%= link_to 'Login', new_user_session_path, class: "btn btn-primary buttons_style" %>
<%= link_to 'Return To Home', root_path, class: "btn btn-primary buttons_style" %>
</div>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<p class="f-logo"><a href="index.html"><img src="images/footer_logo.png" alt="logo-image"></a></p>
<p class="links">
<a href="#">Blog</a>
<a href="#">About</a>
<a href="#">Privacy</a>
<a href="#">Terms</a>
<a href="#">Copyright</a>
</p>
<p class="copy">2014 © Company name. All Rights Reserved</p>
</div>
</footer>
</body>
</html>