HTML学习笔记(一)

H Hyper T Text M Markup L Language:超文本标记语言

 

网页标记语法:

<标记名属性名1=”值” 属性名2=”值”…..>

 

一般修饰性标记都是成对出现的,有开始<标记名>有结束</标记名>,需要修改标记默认效果通过在开始标记中添加属性

完整语法:

<标记名属性名1=”值”属性名2=”值”…..>被修饰的内容</标记名>

特殊的功能性标记:比如换行,插入图像

<标记名属性名1=”值”属性名2=”值”…../>  备注说明:在HTML5中可以省略/

 

网页开发的准备工作:

1.    准备开发工具(IDE),所有的文本开发工具都可以,一般都使用专用工具,如webstorm,

2.    准备浏览器

 

网页的基本结构:

<!DOCTYPE html>

<html lang="en">

<head>

   <meta charset="UTF-8">-à设置网页的编码

   <title>Title</title>-à设置网页标题

</head>

<body>

所有需要显示给用户看的内容都编写在body中

</body>

</html>

 

设置网页标题图标:

<link href="图标地址" type="image/x-icon" rel="shortcut icon"/>

 

地址:分为绝对地址和相对地址

绝对地址:完整的盘符地址:D:\untitled2\favicon.ico

相对地址:参照网页当前地址来查找资源的地址:favicon.ico

因为webstorm开发时网页的具有一种特殊状态(服务器状态,使用盘符的绝对地址无效,所有一般都使用相对地址)

 

常用的网页标记:

标题标记:将被修饰的内容显示为标题级别

所有的文本语言中内容都分为正文和标题

标记名:h,从h1~h6一共6个标题级别,数字越大字体越小

<h1>标题</h1>

<h2>标题</h2>

<h3>标题</h3>

<h4>标题</h4>

<h5>标题</h5>

<h6>标题</h6>

说明:标题标记除字体加粗,字体大小改变。还具有换行功能

标题标记常用属性:

属性名:align

意义:用于设置标题标记的被修饰文本的水平对齐方式

值:left center right

 

换行标记:在出现该标记的地方开始换行功能

标记名:br

 

<br/>

 

段落标记:将被修饰的内容显示为一个段落

标记名:p

<p>被修饰的内容</p>

 

常用属性:

align:设置文本水平对齐方式,值:left center right

 

行:没有任何间距

段落:默认具有段前间距

 

列表标记:分为有序和无序列表

标记名:ul和ol

注意:列表标记必须配合li(列表项标记)一起使用才有意义

<ul>

   <li>列表项1</li>

   <li>列表项2</li>

   <li>列表项3</li>

</ul>

<ol>

   <li>列表项4</li>

   <li>列表项5</li>

   <li>列表项6</li>

   <li>列表项7</li>

</ol>

常用属性:

type:用于设置有序列表的编号类型和无序列表的符号样子

ol默认是:type=”1”,值可以为A, i ,I

ul默认是:type=”disc”,值可以为:square(实心正方形)circle(空心圆)

 

超链接标记:将被修饰的内容和链接进行绑定

标记名:a

该标记存在必须指定属性

<a href="链接地址">被修饰内容,作为超链接标识</a>

说明:默认超链接,具有下划线,标识文本默认为蓝色,点击超链接后默认在当前页面显示新的内容

常用属性:

target:设置超链接显示内容的效果,默认为当前页,值为target=”_blank”,在新的窗口显示

 

使用超链接完成锚点(书签)功能:

1.     使用<a name="自定义的锚点名"></a>,在需要的地方定义锚点

2.     在需要超链接锚点的标记中使用:<a href="#锚点名">标识文本</a>

 

插入图像标记:在需要插入图像的地方使用该标记

标记存在必须属性

<img src=”图片地址”/>   <img src="images/one.jpg">

默认效果:插入图像的大小是完全按照图片本身大小显示,可以通过设置常用属性来改变默认大小

 

常用属性:

width:设置图像的宽度,值为像素值,px为单位的值,如:width=”100px”

height:设置图像的高度,值为像素值,px为单位的值,如:height=”100px”

alt:用于设置图像未正常显示是的提示文本

 

网页中不识别文本编辑上的空格和换行,需要空格和换行必须使用标记来实现

计算机中只识别英文符号,编辑代码时一定是英文输入法状态
阅读更多
下一篇HTML学习笔记(二)
想对作者说点什么? 我来说一句

html常用标签学习笔记

2018年04月01日 26KB 下载

个人html学习笔记 精华版

2009年05月27日 58KB 下载

HTML语言学习笔记

2011年06月29日 101KB 下载

Jsr75学习笔记(一) .txt

2008年12月27日 2KB 下载

HTML学习笔记.ppt

2009年12月22日 156KB 下载

没有更多推荐了,返回首页

关闭
关闭