样式化页面实现（显示一段文章内容）

HTML5：

<!doctype html>
<meta charset="utf-8">
<title>设置新元素的样式</title>
<style type="text/css">
article{display: block}
article header p{font-size: 13px}
article header h1{font-size: 16px}
.p-date{font-size: 11px}
</style>
<article>
<header>
<p class="p-date">日期：2017-12-31</p>
<h1>
<a>
今天是2017年的最后一天，周末，月末，年末。。。。天气不错哟!
</a>
</h1>
<p> 阳光很好，也不是很刺眼，很像北方下雪后的样子呢！</p>
</header>
</article>

页面效果：

由于有些浏览器不支持HTML 5中新增的元素，例如IE 8或者更早的版本，所以，为了能使新增的HTML 5元素应用到样式，可以在头部标记<head>中加入JavaScript代码，这样就可以应用到样式了：

document.creatElement('article');

document.creatElement('header');

</script>

posted @ 2017-12-31 16:17 素心依旧阅读(139) 评论(0) 收藏举报

刷新页面返回顶部