我们认为Stack Overflow不仅应该是非常具体的技术问题的资源,而且还应该是关于如何解决常见问题变化的一般指导原则."基于表单的网站身份验证"应该是这种实验的一个很好的主题.
网上有足够的关于HTML5的信息(以及stackoverflow),但现在我对"最佳实践"感到好奇.section/headers/article之类的标签是新的,每个人对于何时/何地使用这些标签都有不同的看法.那么你们怎么看待以下布局和代码?

1 <!doctype html>
2 <head>
3 <title>Website</title>
4 </head>
5
6 <body>
7 <section>
8 <header>
9 <div id="logo"></div>
10 <div id="language"></div>
11 </header>
12
13 <nav>
14 <ul>
15 <li>menu 1</li>
16 <li>menu 2</li>
17 <li>menu 3</li>
18 <li>menu 4</li>
19 <li>menu 5</li>
20 </ul>
21 </nav>
22
23 <div id="main">
24 <div id="main-left">
25 <article>
26 <header><h1>This is a title</h1></header>
27
28 <p>Lorem ipsum dolor sit amet, consectetur
29 adipiscing elit. Quisque semper, leo eget</p>
30
31 …Run Code Online (Sandbox Code Playgroud) 我有一个奇怪的问题,我遇到了麻烦.所以我一直在研究使用flexbox的原型html5模板.虽然我遇到了一个小问题.我正在尝试通过将"justify-content"属性应用于父div来向模板的侧边栏和内容区域留出一小块空间.虽然它没有在侧边栏和内容区域之间添加空格.我不确定我做错了什么.所以,如果有任何可以帮助我,这将是伟大的.提前致谢!
这是我的HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="../scripts/javascript/responsive_drop_down.js"></script>
<link href="../css/protoflexcss.css" rel="stylesheet" type="text/css" media="screen"/>
<title>Welcome to My Domain</title>
</head>
<body>
<header>
<h1>This is a placeholder <br />
for header</h1>
</header>
<nav class="main">
<div class="mobilmenu"></div>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Video</a></li>
<li><a href="#">Pictures</a></li>
<li><a href="#">Audio</a></li>
<li><a href="#">Other Work</a></li>
<li><a href="#">About Me</a></li>
<li><a href="#">Contact Me</a></li>
</ul>
</nav>
<div id="wrapper">
<article class="content-main">
<section>
<h2>Heading goes here...</h2>
<time datetime="2014-05-21T02:43:00">Officialy Posted On May 21<sup>st</sup> 2:35 A.M.</time>
<p>Content will go …Run Code Online (Sandbox Code Playgroud) 我需要将Open Graph标签添加到博客页面.它从阅读规范(似乎http://ogp.me/使用)og:type的article是要走的路.但是,我发现规范不清楚,我不确定如何正确实现语法.
两个示例网站以不同方式实现此示例:
来自GitHub的示例:(https://github.com/niallkennedy/open-graph-protocol-examples/blob/master/article-utc.html)
<head prefix="og: http://ogp.me/ns# article: http://ogp.me/ns/article#">
<meta property="og:title" content="...">
<meta property="og:type" content="article">
<meta property="article:published_time" content="...">
Run Code Online (Sandbox Code Playgroud)
请注意og和article名称空间已注册,og并且article用作属性.
BBC新闻文章
<head>
<meta property="og:title" content="...">
<meta property="og:type" content="article">
<meta property="og:article:author" content="...">
Run Code Online (Sandbox Code Playgroud)
注意没有命名空间注册,og并且og:article用作属性.
我在上面看到的变体,仅注册og名称空间并仍然og:article作为属性引用.
<head prefix="og: http://ogp.me/ns#">
<meta property="og:title" content="...">
<meta property="og:type" content="article">
<meta property="og:article:published_time" content="..">
Run Code Online (Sandbox Code Playgroud)选项3是我第一次尝试实现它时使用的.当我通过Facebook验证工具运行时,我被告知:
此类对象不允许名为"og:article:published_time"的属性.
目前,我已经选择了1,虽然这有效,但我想知道确切正确的语法是什么?
试图了解HTML5中的新语义元素.
一个<section>属于一个内部<article>还是另一个方向?它甚至重要吗?
我正在考虑重新构建一个wordpress博客.
我正在撰写一篇科学文章,其中我使用Python进行模拟.如何正确引用Python语言?我可以链接到期刊中是否有任何文章?
这也与Python不为人所知的领域中的论文和论文相关.
编辑:请参阅此处获取答案:https://academia.stackexchange.com/questions/5482/how-do-i-reference-the-python-programming-language-in-a-thesis-or-a-paper
尽管在页面上阅读有关<article>和<section>标签的页面我真的不明白如何将它们应用到我的网站.
我在页面末尾有一个包含相关产品的产品页面.首先我想做这样的事情:
<section>
<header><h1>Product title</h1><header>
<img src="image.jpg"/>
<p>Description</p>
<p>Price</p>
<p><a href="...">Order</a></p>
</section>
<section>
<header><h1>Related products</h1></header>
<article>
<a href="..."><img src="image1.jpg"><br/>Product 1</a><br/>Price
</article>
<article>
<a href="..."><img src="image2.jpg"><br/>Product 2</a><br/>Price
</article>
<article>
<a href="..."><img src="image3.jpg"><br/>Product 3</a><br/>Price
</article>
</section>
Run Code Online (Sandbox Code Playgroud)
但是,然后我读了一些其他的博客,它发生在我身上,也许我应该用<section>标签替换<article>标签.
哪个是对的?为什么?谢谢.
这很奇怪,但我没有通过谷歌搜索找到一个非常好的解决方案joomla style intro text.
我想要当前的输出:
<div class="item-content">
<p>Intro Text</p>
<p>Full Text</p>
</div>
Run Code Online (Sandbox Code Playgroud)
被替换为:
<div class="item-content">
<div class="introtext"><p>Intro Text</p></div>
<div class="fulltext"><p>Full Text</p></div>
</div>
Run Code Online (Sandbox Code Playgroud)
我确信Joomla本身应该为introtext宣布这样一个类,或者至少应该有一个可配置的选项.
我不想要的:
{THIS}回答后更新
现在我遇到了问题$this->item->introtext,$this->item->fulltext并且$this->item->text.
我希望$this->item->introtext只显示introtext,但它还包含AFTER READ MORE后的内容.
我应该使用什么属性才能在阅读更多内容之前包含内容,而不是其他任何内容?
我不希望$this->item->introtext内容受到Show Intro Text文章选项中参数的影响.预计只会$this->item->text关心它.我对吗?
注意: $this->item->fulltext按预期工作,仅在READ MORE之后输出内容.
如果Show Intro Text在文章选项中禁用参数,则所有3个变量都会在READ MORE之后返回文本.这应该被视为一个错误.
更明智的做法是让一个变量只返回介绍文本(在任何情况下),一个变量只返回全文(在任何情况下),一个变量根据article参数包含/排除introtext: Show Intro Text
我正在寻找一些开源框架或算法来从任何HTML页面中提取文章文本内容,方法是清除HTML代码,删除垃圾内容,类似于Pocket(又名Read Read Later)软件.
口袋官方网页:http://getpocket.com/
这个问题已在链接下提供: 如何从html中提取文本内容,如稍后阅读或InstaPaper Iphone应用程序? 但我的要求有点不同.我想通过保留字体和样式(CSS)来清理HTML并使用图像提取主要内容.
为什么最后一个孩子没有针对这个小提琴中的最后一篇文章标签?
<div class="parent">
<article class="example">111</article>
<article class="example">111</article>
<article class="example">111</article>
<article class="example">111</article>
<section>content</section>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
.parent .example{ background-color: red;}
.parent .example:last-child{background-color: yellow;}
Run Code Online (Sandbox Code Playgroud)