@using App
@using Helpers
@model App.Model.Cache
@{
ViewBag.Title = @Model.Title;
Layout = null;
}
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1">
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>
<script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
<script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.1.js"></script>
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato"/>
@if (!Model.IsBookmark)
{
<link rel="canonical" href="@(Model.CanonicalUrl())"/>
}
else
{
<link rel="canonical" href="@Model.BookmarkURL"/>
}
<style amp-custom>
body {font-family:Lato, Arial;}
.related {
background-color: #f5f5f5;
display: block;
clear: both;
height: 64px;
margin-bottom: 14px;
}
.related > span {
font-size: 16px;
font-weight: 400;
vertical-align: middle;
margin: 8px;
line-height: 1.2em;
height: 64px;
}
.related:hover {
background-color: #ccc;
}
.related-recipes a {
text-decoration: none;
color: #444;
}
.related-image {
width: 64px;
height: 64px;
float: left;
}
.related-text {
display: inline;
vertical-align: middle;
color: #111;
position: relative;
top: 1.2em;
left: .9em;
text-overflow: clip;
word-break: break-all;
word-wrap: break-word;
}
amp-carousel amp-img > img {
object-fit: contain;
}
amp-carousel figcaption {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 8px;
background: rgba(0, 0, 0, 0.6); /* translucent black */
color: #ddd;
font-size: smaller;
max-height: 30%;
}
amp-carousel .review {
width: 25em;
vertical-align: top;
overflow: auto;
margin: 0;
padding: 16px;
height: 80%; /* TODO easy way to ensure the bottom shadow is visible */
white-space: normal; /* the enclosing div generated by amp-carousel sets it to nowrap */
}
amp-carousel .review:nth-child(even) {
background: #FFFFFF
}
amp-carousel .review:nth-child(odd) {
background: #94C2F9
}
amp-carousel .review h1 {
font-size: larger;
padding: 0;
}
amp-carousel .review p {
padding: 0;
}
amp-carousel .review address:before {
content: '-- ';
}
ul, ol {
padding: 0 16px;
}
/* Unicode-based stars and half-star credit: amoniker, https://coderwall.com/p/iml9ka/star-ratings-in-css-utf8 */
.star-icon {
color: #ddd;
font-size: 34px;
position: relative;
}
.star-icon.full:before {
color: #FDE16D;
content: '\2605'; /* Full star in UTF8 */
position: absolute;
left: 0;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.7);
}
.star-icon.half:before {
color: #FDE16D;
content: '\2605'; /* Full star in UTF8 */
position: absolute;
left: 0;
width: 50%;
overflow: hidden;
text-shadow: 0 0 2px rgba(0, 0, 0, 0.7);
}
.logo {
background-position: left 16px center;
background-repeat: no-repeat;
background-image: url(https://www.bigoven.com/assets/images/icons/bigoven-recipes.png);
background-color: #fefefe;
height: 38px;
text-align: left;
padding: 16px;
padding-left: 72px;
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .2), 0 1px 5px 0 rgba(0, 0, 0, .12);
}
.logo > a {
text-decoration: none;
}
.heading {
text-align: center;
padding-bottom: 8px;
}
.heading > #summary {
font-weight: 500;
}
.heading > small {
color: #656565;
}
.lower-wrapper {
margin: 0em 1em 0em 1em;
}
.title-description {
max-width: 310px;
margin: 0 auto;
}
</style>
</head>
<body>
<div>
...
</div>
</body>
</html>
我在.NET和AMP中编写正确的'IF'语句时遇到问题。声明看起来像这样，它放在一个假设的头部。 AMP Validator引发了三个错误：
以下是我的cshtml模板中if语句的代码片段：
@if (!Model.IsBookmark)
{
<link rel="canonical" href="@(Model.CanonicalUrl())"/>
}
else
{
<link rel="canonical" href="@Model.BookmarkURL"/>
在AMP中处理if语句的正确方法是什么？