IT新手入门,零基础学IT,转行做IT,IT行业的职位选择,你我一同探讨!

IT新手入门网给你介绍IT行业的职位有哪些,让你转行做IT不发愁,IT入门有捷径

当前位置: 主页 > 技能提升 > HTML5/前端互联网工程师 > html5自学-html5基础入门(第二天)

html5自学-html5基础入门(第二天)

时间:2017-01-22 09:11来源:原创 作者:恪己 点击:
回顾 1、HTML基础语法 1、标记 1、双标记 标记内容/标记 2、单标记 标记或标记/ 2、元素 元素指的是标记及其里面的内容 3、元素嵌套 一个元素 被 放在另一个元素中 被嵌套的元素:子级
回顾
1、HTML基础语法
1、标记
1、双标记
<标记>内容</标记>
2、单标记
<标记>或<标记/>
2、元素
元素指的是标记及其里面的内容
3、元素嵌套
一个元素 被 放在另一个元素中
被嵌套的元素:子级元素
嵌套别人的元素:父级元素
注意:
1、嵌套顺序
<div><p></p></div>
2、被嵌套内容换行,加缩进
<div>
<p></p>
</div>
4、属性和值
属性:用来修饰元素
属性 和标签名 之间用 空格隔开
允许出现多属性,多属性之间用 空格 隔开,并且排名不分先后
 
属性值与属性名之间用=连接,最好用引号引起来''或""
通用属性:
id : 唯一的标识
title : 鼠标移入时提示的文字
class : 引用的类选择器
style : 定义 内联 样式
5、注释
<!-- -->
注意:
1、注释不能嵌套
2、注释不能出现在<>中
2、HTML 结构
1、文档类型声明
<!doctype html>
2、html页面
<html></html> 根标记
 
子级标记:
<head></head>
<body></body>
3、head
包含:
<title>标题</title>
<meta charset="utf-8">
<meta name="keywords" content="value1,value2">
<meta name="description" content="">
4、body
... ...
3、文本标记
1、特殊字符
  空格
¥ ¥
> >
< <
© ©
2、文本标记
1、文本样式
<b></b> : 加粗
<i></i> : 斜体
<u></u> : 下划线
<s></s> : 删除线
<sub></sub> : 下标
<sup></sup> : 上标
 
2、标题
<h#></h#>
# : 1~6  从大到小
特点:
1、改变大小
2、加粗
3、垂直的空白
4、独占一行(块级)
3、段落
<p></p>
4、换行
<br>或<br/>
5、水平线
<hr>或<hr/>
属性:
size :尺寸
width :宽度
color :颜色
align :水平对齐方式
6、行内分区元素
<span></span>
作用:包裹文本施加样式
7、块分区
<div></div>
作用:布局
8、预格式化
<pre></pre>
作用:保留源文档中的格式(回车、空格)
9、块级元素 与 行内元素
1、块级
display:block;
独占一行,用于布局,都会具备 align属性
2、行内
display:inline
多个元素在一行内显示,用于处理文本,都没有align属性
4、链接和图像
1、URL
1、绝对路径
1、网络资源
协议,主机名(IP,域名),目录路径,资源名称
https://www.baidu.com/img/bd_logo.png
2、本机资源
从 文件所在的 最高盘符位置处开始
2、相对路径
什么是相对路径:相对于当前文件所在的位置去查找资源文件所经过的路径-通过 文件间的位置关系来进行查找的
1、同目录,直接用
2、子目录,先进入
3、父目录,先返回(../)
3、根相对路径
从 网站 所在的 根目录下开始查找
通过 / 来表示根路径
/img/bd_logo.png
2、图像
语法:<img>
属性:
1、src
显示的图像的 url
2、width
图像的宽度
3、height
图像的高度
 
注意:width 和 height 如果只设置了一个属性的话,那么另外一个会跟着等比缩放
  3、超链接
1、语法
<a>内容</a>
2、属性
1、href
链接URL
只有设置了URL的时候,才会以超链接的形式展现
2、target
目标,打开新网页形式
_blank : 新标签页打开
_self : 默认值,自身标签页中打开
3、链接的表现形式
1、目标文档为下载资源
<a href="rar/zip">
2、电子邮件链接
<a href="mailto:邮件地址" >
3、返回页面顶部空链接
<a href="#">
4、链接到JS
<a href="javascript:">
 
*********************************
1、图像与链接
1、链接-锚点
1、什么是锚点
用于在页面中做一个记号,允许页面随时随地的跳转到这个记号的位置处

     

------分隔线----------------------------
栏目列表
推荐内容