article --- 关于HTML5 标签

<section class="services">
    <div class="fluid-container">
        <h1>Services</h1>                    
        <h2>Our in-house team is comprised of Creatives &amp; Coders</h2>                    
        <article>
            <header>
                <hgroup>
                    <a href="http://werkpress.com/services/" title="Design">
                        <div class="icon" style="background:#35404f url(http://werkpress.com/wp-content/uploads/2013/04/eye.png) no-repeat center center; box-shadow: 0px 6px 1px rgba(0,0,0,.4), 0px 6px 1px #35404f;"></div>    
                    </a>
                    <h1>Design</h1>
                </hgroup>
            </header>
            <div class="copy">
                <p>Our versatile design team specializes in creating kick-ass stuff. We are passionate about the design process and love to watch as designs come to life for our clients. We focus on the following:</p>
                <ul>
                    <li><span style="line-height: 13px;">Custom theme design</span></li>
                    <li>Custom plugin design</li>
                    <li>Logo design</li>
                    <li>Header design</li>
                    <li>Site/Theme design</li>
                    <li>Plugin UI/UX design</li>
                </ul>
            </div><!-- copy -->
            <a href="http://werkpress.com/services/" class="all-services-link">View all of our services</a>
        </article>
    </div>
</section>

1. 定义和用法

<article> 标签定义独立的内容。

可能的 article 实例：

• 论坛帖子
• 报纸文章
• 博客条目
• 用户评论

2. 结构

article标签可包含header

3.HTML5 标签 hgroup 已经被废除

相关链接：http://blog.wpjam.com/2013/04/17/html5-tag-hgroup-has-been-deprecated/



The 网站链接：
http://werkpress.com/

li 前面的 绿色方形      写法是当成一个元素来处理，所以无论是写:after还是:before效果还是一样的，区别是z-index, :after的z-index会比:before低

section.services article .copy ul li:after, section.services article .copy ol li:after {
    content: "";
    display: block;
    height: 8px;
    width: 6px;
    background: #a3d39c;
    position: absolute;
    left: -15px;
    top: 2px;
}