HTML5 学习笔记（1）

最新推荐文章于 2022-10-11 21:08:10 发布

Angelamiss

最新推荐文章于 2022-10-11 21:08:10 发布

阅读量545

点赞数

分类专栏：网站制作文章标签：网站制作

本文链接：https://blog.csdn.net/Angelamiss/article/details/38753031

版权

网站制作专栏收录该内容

3 篇文章 0 订阅

订阅专栏

一、 html基本构成

HTML标签:

<标签>内容</标签>

HTML 元素: （包含整个部分）

<p>This is a paragraph. </p>

文件： .htm .html 扩展名没有区别

二、 html 5

HTML5 中的一些有趣的新特性：

用于绘画的 canvas 元素
用于媒介回放的 video 和 audio 元素
对本地离线存储的更好的支持
新的特殊内容元素，比如 article、footer、header、nav、section
新的表单控件，比如 calendar、date、time、email、url、search

HTML5 的标签及属性描述 http://www.w3cschool.cc/tags/html-reference.html

三、基本标签

标题 <h1>这是一个标题</h1>

段落 <p>这是一个段落。</p>

链接 <a href="http://www.w3cschool.cc">这是一个链接</a>

图像 <img src="w3cschool.png" width="104" height="142">

注释

水平线 <hr />

html字符实体

HTML布局 div元素

<!DOCTYPE html>
<html>
<body>

<div id="container" style="width:500px">

<div id="header" style="background-color:#FFA500;">
<h1 style="margin-bottom:0;">Main Title of Web Page</h1></div>

<div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;">
<b>Menu</b><br>
HTML<br>
CSS<br>
JavaScript</div>

<div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;">
Content goes here</div>

<div id="footer" style="background-color:#FFA500;clear:both;text-align:center;">
Copyright © W3Schools.com</div>

</div>
</body>
</html>

Main Title of Web Page

Menu
HTML
CSS
JavaScript

Content goes here

四、HTML CSS

CSS 是在 HTML 4 开始使用的,是为了更好的渲染HTML元素而引入的.

内联样式- 在HTML元素中使用"style" 属性
<p style="color:blue;margin-left:20px;">This is a paragraph.</p>
内部样式表 -在HTML文档头部 <head> 区域使用<style> 元素来包含CSS
<head>
<style type="text/css">
body {background-color:yellow;}
p {color:blue;}
</style>
</head>
外部引用 - 使用外部 CSS 文件
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

   定义背景颜色 
 

   <!DOCTYPE html> 
  
 <html> 
  
 <body style="background-color:yellow;"> 
  
 <h2 style="background-color:red;">This is a heading</h2> 
  
 <p style="background-color:green;">This is a paragraph.</p> 
  
 </body> 
  
 </html>

五、HTML交互

html表单：文本输入，复选框，提交按钮等；

html框架：通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面

六、HTML脚本

浏览器不支持script时显示的内容

xhtml规范了HTML

Angelamiss

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
HTML5 学习笔记（1）

HTML5 中的一些有趣的新特性：用于绘画的 canvas 元素用于媒介回放的 video 和 audio 元素对本地离线存储的更好的支持新的特殊内容元素，比如 article、footer、header、nav、section新的表单控件，比如 calendar、date、time、email、url、search
复制链接

扫一扫