web标准
结构标准(structure):结构用于对网页元素进行整理和分类,主要包括XML和XHTML两个部分。
样式标准(presentation):表现用于设置网页元素的版式,颜色,大小等外观样式,主要指的是CSS。
行为标准(behavior):行为是指网页模型的定义及交互的编写,主要包括DOM和ECMAScript。
HTML入门
HTML(英文Hyper Text Markup Language的缩写),中文翻译为“超文本标签语言”
注意体会“标签,文本”几个词。
HTML骨架
<html>
<head>
<title></title>
</head>
<body>
</body>
</html>
标签分类
有单标签(非常少)和双标签,双标签占绝大多数。
“ / ” 称为关闭符号。
标签关系
嵌套关系和并列关系。
建议:如果两元素是嵌套关系,子元素最好缩进一个tab。如果是并列关系,就上下对齐。
HTML标签
标题标签
<h1><h2><h3><h4><h5>和<h6>
作为标题使用,且重要性依次递减。
基本格式:
<hn> 标题文本 <hn/>
注意:尽量少用h1, 一般h1都是给logo使用。
段落标签
<p> </p>
水平线标签
<hr />
这是个单标签
换行标签
<br />
break的缩写,像word里直接敲回车是没用的。
div和span标签
<div></div>
<span></span>
用来分区
文本格式化标签
标签属性
<标签名 属性1=“属性1值” 属性2=“属性2值” ···></标签名>
e.g.
width表示长度,color表示颜色
图像标签
单标签
<img src="图片URL" />
src是一个属性,表示路径。
链接标签
anchor的缩写,锚
<a href="https://www.baidu.com/" target="_blank">百度(链接名称)</a>
href用于指定连接目标的URL地址,具有超链接功能。
target:指定目标窗口打开方式,常见取值有两种,self和blank,self是默认,blank是打开新窗口。
外部链接需要添加 https://
当没有确定链接时,可用“#”定义href属性(href="#"),表示空链接。
注意:不仅可以创建文本超链接,图片,音频,页面内目录跳转等等都可以创建超链接。
锚点定位
<a href="# + id名">链接文本</a>
跳转到
<hn id="id名"></hn>
base标签
全局设置链接打开方式为新页面
<head>
<base target="_blank"/>
</head>
特殊字符标签
注释标签
<!-- 注释内容 -->
相对路径
如果图片和HTML文件位于同一文件夹,只需输入图像名称即可,如
如果图片位于HTML的下一级文件夹,要输入文件夹名和文件名,之间用“ / ”隔开,如
如果图片位于HTML的上一文件夹,在文件名前加入"…/",如果是上两级,则需要使用"…/…/",以此类推,如
绝对路径
C:\Users\94479\Desktop\logo.jpg(很少使用)或完整网络地址
无序列表ul
<ul>
<li>列表项1</li>
<li>列表项2</li>
<li>列表项3</li>
<li>
<h4></h4>
<p></p>
</li>
</ul>
注意:
- ,但是
- 标签中可以随便放。
有序列表
<ol> <li>列表项1</li> <li>列表项2</li> <li>列表项3</li> <li> <h4></h4> <p></p> </li> </ol>
注意:
- ,但是
- 标签中可以随便放。
自定义列表
<dl> <dt>名词<dt> <dd>名词解释<dd> <dd>名词解释<dd> <dd>名词解释<dd> ... </dl>