《HTML5与CSS3实战指南》——第2章 HTML5样式的标记2.1 The HTML5 Herald简介

简介:

本节书摘来自异步社区《HTML5与CSS3实战指南》一书中的第2章,第2.1节,作者: 【美】Estelle Weyl , Louis Lazaris , Alexis Goldstein 更多章节内容可以访问云栖社区“异步社区”公众号查看。

第2章 HTML5样式的标记

我们已经向您介绍了关于HTML5历史的一些基本知识,以及学习它的重要性。现在,我们将在您的项目中开始使用它。首先向您介绍我们将在本书中逐步创建的示例网站。

在简单介绍了我们将创建的示例网站之后,我们将讨论一些HTML5的基本语法知识,以及编码最佳实践的一些建议。我们将遵循浏览器兼容性及HTML5页面结构基本原理等一些重要原则。最后,我们向您介绍一些HTML5特有的元素,以及如何使它们适应布局。

现在开始吧!

2.1 The HTML5 Herald简介

我们首先从头开始创建一个示例网站项目。
这是一个老式的报纸风格的网站,名为The Html5 Herald。网站的主页包含一些以视频、图片、文章和广告形式呈现的媒体,而且在另一个页面上包含一个注册表。

我们来看一下源代码,如果愿意可以尝试一些功能。在我们学习本书时,我们将通过编写代码来制作网站。我们不可能涉及有关CSS的每一个细节,因为您可能已经熟悉了大部分内容:浮动布局、绝对和相对定位,以及基本字体样式等。我们将主要介绍HTML5的新增元素、API,以及所有用于为各种元素添加样式及互动的新CSS技术。

图2.1所示为已创建网站的外观示意。


0876eea4af27814e35ddb06c73a91ac09a974d8e

构建网站时,我们会详细解释HTML5的新增元素、API以及CSS3的新功能,同时,我们也将向您推荐一些最佳实践。当然,其中的一些新技术还在开发中,所以我们不可能武断地告诉您这些技术可以做什么,以及不可以做什么。

相关文章
|
1月前
|
数据可视化 前端开发
HTML基础结构和常用标记的例子
HTML基础结构和常用标记的例子
15 0
|
1月前
|
数据安全/隐私保护
7.常用的HTML标记
7.常用的HTML标记
13 0
|
1月前
|
前端开发
web前端开发-----CSS样式设置
web前端开发-----CSS样式设置
29 0
|
1月前
|
前端开发 JavaScript
css之伪类hover改变自身、子元素、其他元素的样式
css之伪类hover改变自身、子元素、其他元素的样式
27 0
|
3天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
13 1
|
7天前
|
前端开发
|
10天前
|
移动开发 前端开发
【通用CSS模板】移动端H5页面统一样式.css
【通用CSS模板】移动端H5页面统一样式.css
N..
|
24天前
HTML常用标记
HTML常用标记
N..
13 1
|
27天前
|
前端开发 容器 内存技术
使用CSS3画出一个叮当猫HTML源码
本文教程介绍了如何使用CSS3绘制叮当猫,通过HTML结构和CSS样式逐步构建叮当猫的各个部位,如头部、脸部、脖子、身体、手脚等。代码示例展示了如何利用渐变、边框、阴影和定位技巧实现三维效果和细节特征。此外,还添加了眼珠的动画效果,让叮当猫的眼睛能够转动。整个过程适合对CSS3感兴趣的读者参考学习,以提升动态图形创作技能。
16 0
使用CSS3画出一个叮当猫HTML源码