首页 > 课程库 > HTML5+CSS3快速入门
HTML5+CSS3快速入门

HTML5+CSS3快速入门

HTML5+CSS3是web前端开发的常用基础语言之一,本章将分别从html5相关元素及应用、css3相关元素及应用及html5+css3实战等方面进行介绍,快速入门html5+css3。

Web前端开发

62章节|227281次播放

查看课程视频学习交流群
486792092

21小时学习时长
更全面的职业课程大纲立即查看
  • 学习HTML5

    学习目标

    适用人群只有你对网页前端技术感兴趣,你就可以学习,学了本教程之后你也会学会利用HTML5制作出一个完美的网页。课后目标1、完全掌握HTML5网页结构2、熟悉并掌握常用的css3新增的样式属性3、能够独立地完成常见HTML5网页效果图欣赏(HTML5拖放技术效果图,可以把下面的图片拖放在上面的空白处)... 查看原文

  • 学习HTML5

    如何打开文件

    开发环境安装好后,打开环境:     下面打开一个项目,比如canvas绘制圆形,选中canvas绘制圆形,然后点击OK。如图所示: 打开之后,就可以看见我们的源代码了,如下图所示: 若想要预览我们开发环境的效果图,就点击右上角的浏览器图标,就可以在对应的浏览器中显示出来。如图所示:  (canva... 查看原文

  • 学习HTML5

    HTML5简介

    什么是HTML5首先了解HTMLHTML即超文本标记语言(HyperText Markup language),这是一种语法简单、结构清晰的语解释型文档,他不同于其他的编程语言。HTML5就是HTML网页标记语言的第五次重大更新产品,在这个版本中,新功能不断推出,以帮助Web应用程序的作者,努力提高... 查看原文

  • 学习HTML5

    WebStorm安装

    本节讲解开发工具的安装与汉化下载地址http://pan.baidu.com/s/1sj4Uu0P安装与汉化步骤1、打开url,并下载webstorm8.0.zip,并解压压缩包。如图所示: 2、打开文件夹,可以看到如下图所示的三个文件。 第一个文件是序列号文件,第二个文件是中文的汉化文件,第三个是... 查看原文

  • 学习HTML5

    初始化设置

    安装完成后,现在剩下最后一个步骤,就是初始化的设置点击创建新项目叫MAIZI,如图所示:  随后再创建一个HTML  File网页叫INDEX,见图:   如何改变它的字体大小以及背景颜色呢?具体步骤如下:点击【文件】→选中【设置】,然后找到【Editor】→再找到【Colors&Fonts】最后找... 查看原文

  • 学习HTML5

    网页结构

    HTML5的网页结构<!DOCTYPE html><html><head>   <meta charset="UTF-8">   <title></title></head><body>  <header>...</header>  <nav>...</nav>  <article>...</art... 查看原文

  • 学习HTML5

    article元素

    这节课的学习内容是掌握HTML5当中新增的主体结构元素,新增的主体结构元素有article、section、aside、nav、time、pubdate。我们要学会在HTML5中应该怎样结合应用这些新增的主体结构来合理编排我们网页的总体布局。什么是Article元素代表文档、页面、应用程序中独立的完... 查看原文

  • 学习HTML5

    Section元素

    什么是Section元素Section元素是对网站、网页进行内容分块的元素。一个section元素通常是由内容和它的标题组成,section元素并非是一个普通的容器元素,当一个容器需要被直接定义样式的时候,我们还是推荐大家是div,下面我们就通过一段简单的代码来认识我们section元素。Secti... 查看原文

  • 学习HTML5

    Aside元素

    什么是Aside元素Aside元素通常用来表示当前页面的附属信息部分,它可以包含我们当前页面或者说是主题内容相关的一些引用,侧边栏、广告等,有别与我们主要内容。Aside元素用法Aside元素主要使用方法有两种:1.被包含在article元素中作为主要内容的附属信息部分,它其中的内容可以是我们当前文... 查看原文

  • 学习HTML5

    Nav元素

    什么是Nav元素Nav元素可以用作页面导航的链接组,在导航链接组里面有很多的链接,点击每个链接可以链接到其他页面或者当前页面的其他部分,并不是所有的链接组都要被放在nav元素里面,我们只需要把最主要的、基本的、重要的放在nav元素里面即可。比如说页脚底部如果有个版权申明,我们就不建议使用nav元素,... 查看原文

  • 学习HTML5

    Time元素

    什么是Time元素Time元素表示24小时中的某一个时刻、或者日期,表示时间时允许带时差。格式他可以定义的格式如下:<time datetime="2014-9-28">2014年9月28<time><time datetime="2014-9-28">9月28<time><time datetim... 查看原文

  • 学习HTML5

    Pubdate属性

    什么是Pubdate属性Pubdate属性可以用在article元素里面的time上面表示,当前文章的发布时间Pubdate属性用法下面就来具体演示下pubdate属性的具体用法:<body><header><h1>你好pubdate</h1><p>发布时间:<time datetime=”2014... 查看原文

  • 学习HTML5

    Header元素

    什么是header元素header元素是一种具有引导和导航作用的结构元素,通常用来放置整个页面或页面内的一个内容区块的标题,但也可以包含其他的内容,比如在header里面放置logo图片、搜索表单等等。注意:一个页面内并没有限制header的出现次数,也就是说我们可以在同一页面内,不同的内容区块上分... 查看原文

  • 学习HTML5

    Hgroup元素

    什么是hgroup元素hgroup元素是将标题和他的子标题进行分组的元素。hgroup元素一般会把h1-h6的元素进行分组,比如在一个内容区块的标题和他的子标题算是一组。通常情况下,文章只有一个主标题时,是不需要hgroup元素的。hgroup元素的用法下面我们就在开发环境中进行详细的演示:<art... 查看原文

  • 学习HTML5

    Footer元素

    什么是footer元素footer元素可以作为他的上层父级内容区块或是一个根区块的注脚。footer元素一般情况下包括与它相关的区块的注脚信息,比如作者、版权信息等。 footer元素的用法下面我们就在开发环境中一起来演示下footer元素:首先我们先来演示下HTML5之前的一种格式,在HTML5之... 查看原文

  • 学习HTML5

    Address元素

    什么是address元素address元素用来在页面中呈现联系信息,包括文档的作者、邮箱、地址、电话信息等。address元素还用来展示和文章中的相关的联系人的所有联系信息。address元素的用法接下来就来练习下如何使用address元素。 下面就在开发环境中演示下这样一个页面<body><hea... 查看原文

  • 学习HTML5

    figure元素

    什么是figure元素和figcaption元素figure元素是一种元素的组合,带有可选标题。figure元素用来表示页面上一块独立的内容,如果将他从网页上删除不给我们的网页造成影响。figcaption元素表示figure元素的标题,它属于figure元素,figcaption元素必须书写在fi... 查看原文

  • 学习HTML5

    details和summary元素

    案例首先我们先看来一个网页 网页中有个标题:HTML5+CSS3视频教程,这个标题前面有个三角形,点击这个标题或者三角符号的时候,会弹出一弹文字,再次点击时,就隐藏掉了,这就是details元素和summary元素的结合。details元素是一种用于标识该元素内部的子元素可以被展开、收缩显示的元素。... 查看原文

  • 学习HTML5

    Mark元素

    什么是mark元素mark元素表示页面中需要突出显示或高亮显示的,对于当前用户具有参考作用的一段文字。通常在引用原文时使用mark元素,目的是引起读者的注意。mark元素是对原文内容有补充作用的一个元素,他应该用在一段原文作者不认为重要的,但是现在为了与原文作者不相关的其他目的而需要突出显示或者高亮... 查看原文

  • 学习HTML5

    mark使用实例

    mark使用实例1<!DOCTYPE html> <html> <head>     <meta charset="UTF-8">     <title></title> </head> <body> <h2>以下是关于<mark>HTML5</mark>的搜索结果</h2> <se... 查看原文

  • section元素所属章节:section元素
    下载
  • aside元素所属章节:aside元素
    下载
  • nav元素所属章节:nav元素
    下载
  • pubdate元素所属章节:pubdate元素
    下载
  • 9、header元素所属章节:9、header元素
    下载
  • Web前端开发之HTML5+CSS3快速入门所属章节:Web前端开发之HTML5+CSS3快速入门
    下载
  • section元素 源码所属章节:section元素 源码
    下载
  • aside元素 源码所属章节:aside元素 源码
    下载
  • nav元素 源码所属章节:nav元素 源码
    下载
  • pubdate属性 源码所属章节:pubdate属性 源码
    下载
  • header元素合成 源码所属章节:header元素合成 源码
    下载
  • hgroup元素合成 源码所属章节:hgroup元素合成 源码
    下载
  • footer元素 源码所属章节:footer元素 源码
    下载
  • address元素合成 源码所属章节:address元素合成 源码
    下载
  • figure元素与figcaption元素 源码所属章节:figure元素与figcaption元素 源码
    下载
  • details元素与summary元素 源码所属章节:details元素与summary元素 源码
    下载
  • mark元素 源码所属章节:mark元素 源码
    下载
  • progress元素 源码所属章节:progress元素 源码
    下载
  • meter元素 源码所属章节:meter元素 源码
    下载
  • HTML5的大纲(上)源码所属章节:HTML5的大纲(上)源码
    下载
  • HTML5的大纲(下)源码所属章节:HTML5的大纲(下)源码
    下载
  • 加强版的ol列表元素 源码所属章节:加强版的ol列表元素 源码
    下载
  • 重新定义后的dl元素 源码所属章节:重新定义后的dl元素 源码
    下载
  • canvas元素创建画布 源码所属章节:canvas元素创建画布 源码
    下载
  • canvas绘制矩形 源码所属章节:canvas绘制矩形 源码
    下载
  • canvas绘制圆形 源码所属章节:canvas绘制圆形 源码
    下载
  • canvas绘制文字 源码所属章节:canvas绘制文字 源码
    下载
  • canvas保存文件 源码所属章节:canvas保存文件 源码
    下载
  • canvas绘制动画 源码所属章节:canvas绘制动画 源码
    下载
  • Web Storage本地储存 源码所属章节:Web Storage本地储存 源码
    下载
  • 简单的网页留言板 源码所属章节:简单的网页留言板 源码
    下载
  • HTML5拖放 源码所属章节:HTML5拖放 源码
    下载
  • CSS3新增的属性选择器 源码所属章节:CSS3新增的属性选择器 源码
    下载
  • 结构性伪类选择器上 源码所属章节:结构性伪类选择器上 源码
    下载
  • video元素与audio元素的常用属性 源码所属章节:video元素与audio元素的常用属性 源码
    下载
  • UI元素状态伪类选择器上 源码所属章节:UI元素状态伪类选择器上 源码
    下载
  • 使用选择器在页面中插入内容 源码所属章节:使用选择器在页面中插入内容 源码
    下载
  • video元素与audio元素的基础知识 源码所属章节:video元素与audio元素的基础知识 源码
    下载
  • 文字阴影与自动换行 源码所属章节:文字阴影与自动换行 源码
    下载
  • 服务器端字体和@font-face属性 源码所属章节:服务器端字体和@font-face属性 源码
    下载
  • 盒模型 源码所属章节:盒模型 源码
    下载
  • CSS3中新增的背景属性 源码所属章节:CSS3中新增的背景属性 源码
    下载
  • CSS3中边框相关的样式 源码所属章节:CSS3中边框相关的样式 源码
    下载
  • CSS3中的变形功能 源码所属章节:CSS3中的变形功能 源码
    下载
  • 布局相关的样式-多栏布局 源码所属章节:布局相关的样式-多栏布局 源码
    下载
  • CSS3中的动画功能 源码所属章节:CSS3中的动画功能 源码
    下载
  • 布局相关的样式-盒布局 源码所属章节:布局相关的样式-盒布局 源码
    下载
  • 布局相关的样式-弹性盒布局 源码所属章节:布局相关的样式-弹性盒布局 源码
    下载
  • Media Queries 与自适应布局 源码所属章节:Media Queries 与自适应布局 源码
    下载
  • 集团网站建设 素材所属章节:集团网站建设 素材
    下载
  • 集团网站建设 源码所属章节:集团网站建设 源码
    下载
  • header元素合成 课程资料所属章节:header元素合成 课程资料
    下载
  • html5+css3 思维导图所属章节:html5+css3 思维导图
    下载
  • section元素 源码所属章节:section元素 源码
    下载
  • aside元素 源码所属章节:aside元素 源码
    下载
  • nav元素 源码所属章节:nav元素 源码
    下载
  • pubdate属性 源码所属章节:pubdate属性 源码
    下载
  • header元素合成 源码所属章节:header元素合成 源码
    下载
  • hgroup元素合成 源码所属章节:hgroup元素合成 源码
    下载
  • footer元素 源码所属章节:footer元素 源码
    下载
  • address元素合成 源码所属章节:address元素合成 源码
    下载
  • figure元素与figcaption元素 源码所属章节:figure元素与figcaption元素 源码
    下载
  • details元素与summary元素 源码所属章节:details元素与summary元素 源码
    下载
  • mark元素 源码所属章节:mark元素 源码
    下载
  • progress元素 源码所属章节:progress元素 源码
    下载
  • meter元素 源码所属章节:meter元素 源码
    下载
  • HTML5废除的元素 源码所属章节:HTML5废除的元素 源码
    下载
  • html5的大纲(上) 源码所属章节:html5的大纲(上) 源码
    下载
  • html5的大纲(下)源码所属章节:html5的大纲(下)源码
    下载
  • 加强版的ol列表元素 源码所属章节:加强版的ol列表元素 源码
    下载
  • 重新定义后的dl元素 源码所属章节:重新定义后的dl元素 源码
    下载
  • canvas元素创建画布 源码所属章节:canvas元素创建画布 源码
    下载
  • canvas绘制矩形 源码所属章节:canvas绘制矩形 源码
    下载
  • canvas绘制圆形 源码所属章节:canvas绘制圆形 源码
    下载
  • canvas绘制文字 源码所属章节:canvas绘制文字 源码
    下载
  • canvas保存文件 源码所属章节:canvas保存文件 源码
    下载
  • canvas绘制动画 源码所属章节:canvas绘制动画 源码
    下载
  • web storage本地储存 源码所属章节:web storage本地储存 源码
    下载
  • 简单的网页留言板 源码所属章节:简单的网页留言板 源码
    下载
  • video元素与audio元素的基础知识 源码所属章节:video元素与audio元素的基础知识 源码
    下载
  • html5拖放 源码所属章节:html5拖放 源码
    下载
  • css3新增的属性选择器 源码所属章节:css3新增的属性选择器 源码
    下载
  • 结构性伪类选择器 源码所属章节:结构性伪类选择器 源码
    下载
  • ui元素状态伪类选择器 源码所属章节:ui元素状态伪类选择器 源码
    下载
  • 使用选择器在页面中插入内容 源码所属章节:使用选择器在页面中插入内容 源码
    下载
  • 文字阴影与自动换行 源码所属章节:文字阴影与自动换行 源码
    下载
  • 服务器端字体和@font-face属性 源码所属章节:服务器端字体和@font-face属性 源码
    下载
  • 盒模型 源码所属章节:盒模型 源码
    下载
  • css3中新增的背景属性 源码所属章节:css3中新增的背景属性 源码
    下载
  • css3中边框相关的样式 源码所属章节:css3中边框相关的样式 源码
    下载
  • css3中的变形功能 源码所属章节:css3中的变形功能 源码
    下载
  • css3中的动画功能 源码所属章节:css3中的动画功能 源码
    下载
  • 布局相关的样式-多栏布局 源码所属章节:布局相关的样式-多栏布局 源码
    下载
  • 项目实战 源码所属章节:项目实战 源码
    下载
Web前端开发朱朝兵

朱朝兵

TA的课程

自由职业,DZ起点网创始人,一直专注前端技术与Discuz模板设计与制作! 2014年为“中国网”旗下子网站“聚焦中国梦”栏目进行创建。

更专业的职业课程

Web前端开发22745位同学正在学习

Web前端开发

你有一个红包等你领取!

免费电话咨询