html5

<hr />是单标记，在网页中输入一个<hr />，就添加了一条默认样式的水平线。

br: 换行标记 : < /> 用于实现段落强制换行的效果。


//PNG GIF JPG三者的区别

src属性用于指定图像文件的路径和文件名

2.alt:图像的替换文本属性，在图像无法显示时告诉用户该图片的内容。
width和height:用来定义图片的宽度和高度，通常我们只设置其中的一个，另一个会按原图等比例显示。
border:为图像添加边框、设置边框的宽度。但边框颜色的调整仅仅通过HTML属性是不能够实现的。
vspace\\\\hspace:HTML中通过vspace和hspace属性可以分别调整图像的垂直边距和水平边距。
align:图像的对齐属性align。用于调整图像的位置
相对路径:不带有盘符，通常是以HTML网页文件为起点，通过层级关系描述目标图像的位置。
1.图像文件和html文件位于同一文件夹：只需输入图像文件的名称即可，如 < img src=“log.gif” />。
2.图像文件位于html文件的下一级文件夹：输入文件夹名和文件名，之间用“/”隔开，
3.图像文件位于html文件的上一级文件夹：在文件名之前加入“…/” ，如果是上两级，则需要使用 “…/ …/”，以此类推，如<img src=" …/logo.gif " / >。
绝对路径:一般是指带有盘符的路径，例如完整的地址
“C:\Users\dell\AppData\Roaming\HBuilder X\user/logo.gif”。
超链接：在HTML中创建超链接非常简单，只需用标记环绕需要被链接的对象即可。< a href=“跳转目标” target=“目标窗口的弹出方式”> 文本或图像
href:用于指定链接目标的url地址，当为标记应用href属性时，它就具有了超链接的功能。
target:用于指定链接页面的打开方式，其取值有_self和_blank两种，其中_self为默认值，意为在原窗口中打开， _blank为在新窗口中打开 。
锚点：1.使用“< a href="#id名 " >链接文本”创建链接文本
2.使用相应的id名标注跳转目标的位置

css3:

1.运用CSS3私有属性时，要遵从一定的书写顺序，即先写私有的CSS3属性，再写标准的CSS3属性。

2.hfhfh当一个CSS3属性成为标准属性，并且被主流浏览器的最新版普遍兼容的时候，就可以省略私有的CSS3属性。
规则：
选择器{属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}
在上面的样式规则中，选择器用于指定CSS样式作用的HTML对象，花括号内是对该对象设置的具体样式。其中，属性和属性值以“键值对”的形式出现，用英文“:”连接，多个“键值对”之间用英文“;”进行区分。

1.CSS样式中的选择器严格区分大小写，属性和值不区分大小写，按照书写习惯一般将“选择器、属性和值”都采用小写的方式。
2.多个属性之间必须用英文状态下的分号隔开，最后一个属性后的分号可以省略，但是为了便于增加新样式最好保留。
3.如果属性的值由多个单词组成且中间包含空格，则必须为这个属性值加上英文状态下的引号。
4.在编写CSS代码时，为了提高代码的可读性，通常会加上CSS注释。
5.在CSS代码中空格是不被解析的，花括号以及分号前后的空格可有可无。

CSS样式表:
行内式：也称为内联样式，是通过标记的style属性来设置元素的样式。
<标记名 style=“属性1:属性值1; 属性2:属性值2; 属性3:属性值3;”> 内容 </标记名>

内嵌式：是将CSS代码集中写在HTML文档的头部标记中，并且用< style >标记定义。
< head>< style type=“text/css”>选择器 {属性1:属性值1; 属性2:属性值2; 属性3:属性值3;}< /style> < /head>

链入式：是将所有的样式放在一个或多个以.css为扩展名的外部样式表文件中，通过标记将外部样式表文件链接到HTML文档中。
< head>< link href=“CSS文件的路径” type=“text/css” rel=“stylesheet” />
< /head>

选择器：要想将CSS样式应用于特定的HTML元素，首先需要找到该目标元素。在CSS中，执行这一任务的样式规则部分被称为选择器

css基础选择器：
1.标签指定式选择器:又称交集选择器，由两个选择器构成，其中第一个为标记选择器，第二个为class选择器或id选择器，两个选择器之间不能有空格，如h3.special或p#one。
例如：
2.后代选择器：用来选择元素或元素组的后代，其写法就是把外层标记写在前面，内层标记写在后面，中间用空格分隔。当标记发生嵌套时，内层标记就成为外层标记的后代。
例如：
3.并集选择器：是各个选择器通过逗号连接而成的，任何形式的选择器都可以作为并集选择器的一部分。若某些选择器定义的样式完全或部分相同，可利用并集选择器为它们定义相同的样式。
例如：

字体样式属性：
1.font-size属性用于设置字号，该属性的值可以使用相对长度单位，也可以使用绝对长度单位。

相对长度单位	                   说明
em	                           相对于当前对象内文本的字体尺寸
px	                           像素，最常用，推荐使用
绝对长度单位                  	说明
in	                            英寸
cm	                             厘米
mm	                             毫米
pt	                             点

2.font-family属性用于设置字体。网页中常用的字体有宋体、微软雅黑、黑体等。
例如：p{ font-family:“微软雅黑”;}
3.font-weight属性用于定义字体的粗细。

值	描述
normal	默认值。定义标准的字符。
bold	定义粗体字符。
bolder	定义更粗的字符。
lighter	定义更细的字符。
100~900（100的整数倍）	定义由细到粗的字符。其中400等同于normal，700等同于bold，值越大字体越粗。

4.font-style属性用于定义字体风格，如设置斜体、倾斜或正常字体。
normal：默认值，浏览器会显示标准的字体样式;
italic：浏览器会显示斜体的字体样式;
oblique：浏览器会显示倾斜的字体样式;
5.font属性用于对字体样式进行综合设置。
选择器{font: font-style font-variant font-weight font-size/line-height font-family;}
6.通过**@font-face**属性，开发者可以在用户计算机未安装字体时，使用任何喜欢的字体。
@font-face{font-family:字体名称;src:字体路径; }
7.word-wrap属性用于长单词和URL地址的自动换行
选择器{word-wrap:属性值;}

值	              描述
normal	     只在允许的断字点换行（浏览器保持默认处理）。
break-word	 在长单词或 URL 地址内部进行换行。

当word-wrap属性值为break-word时，URL地址会沿边框自动换行。
文本外观属性：
1.color属性：用于定义文本的颜色，其取值方式有如下3种：
预定义的颜色值，如red，green，blue等。
十六进制，如#FF0000，#FF6600，#29D794等。实际工作中，十六进制是最常用的定义颜色的方式。
RGB代码，如红色可以表示为rgb(255,0,0)或rgb(100%,0%,0%)。
2.letter-spacing属性:用于定义字间距，所谓字间距就是字符与字符之间的空白。其属性值可为不同单位的数值，允许使用负值，默认为normal。
3.word-spacing属性:用于定义英文单词之间的间距，对中文字符无效。和letter-spacing一样，其属性值可为不同单位的数值，允许使用负值，默认为normal。
4.line-height属性用于设置行间距，所谓行间距就是行与行之间的距离，即字符的垂直间距，一般称为行高。常用的属性值单位有三种，分别为像素px，相对值em和百分比%，实际工作中使用最多的是像素px。
5.text-transform属性:用于控制英文字符的大小写。
属性值如下：
none：不转换（默认值）。
capitalize：首字母大写。
uppercase：全部字符转换为大写。
lowercase：全部字符转换为小写。
6.text-decoration属性:用于设置文本的下划线，上划线，删除线等装饰效果。
可用属性值如下：
none：没有装饰（正常文本默认值）。
underline：下划线。
overline：上划线。
line-through：删除线
7.text-align属性:用于设置文本内容水平对齐，相当于html中的align对齐属性。
可用属性值如下：
left：左对齐（默认值）
right：右对齐。
center：居中对齐。
8.text-indent属性:用于设置首行文本的缩进。属性值可为不同单位的数值、em字符宽度的倍数、或相对于浏览器窗口宽度的百分比%，允许使用负值, 建议使用em作为设置单位。
9.white-space属性:可设置空白符的处理方式。
属性值如下：
normal：常规（默认值），文本中的空格、空行无效，满行（到达区域边界）后自动换行。
pre：预格式化，按文档的书写格式保留空格、空行原样显示。
nowrap：空格空行无效，强制文本不能换行，除非遇到换行标记
。内容超出元素的边界也不换行，若超出浏览器页面则会自动增加滚动条。
****10:text-shadow:使用text-shadow属性可以为页面中的文本添加阴影效果。
选择器{ text-shadow:h-shadow v-shadow blur color;}
*****11:text-overflow属性:用于标示对象内溢出的文本。
选择器{text-overflow:属性值;}
常用取值有两个：
clip：修剪溢出文本，不显示省略标记“…”。
ellipsis：用省略标记“…”标示被修剪文本，省略标记插入的位置是最后一个字符

文本外观属性：
设置省略标记标示溢出文本的具体步骤如下：
1.为包含文本的对象定义宽度。
2.应用“white-space:nowrap;”样式强制文本不能换行。
3.应用“overflow:hidden;”样式隐藏溢出文本。
4.应用“text-overflow:ellipsis;”样式显示省略标记。
例如：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			p{color:blue;}
			.shadow{
				font-size:30px;
				text-shadow:3px 10px 1px red;
			}
			    .one{
				font-size:20px;
				width:200px;
				height:300px;
				border:80px 80px;
				white-space:nowrap;
				overflow:hidden;
				text-overflow:ellipsis;
			}
			
		</style>
	</head>
	<body>
		<p class="shadow" align=center>重要消息</p>
		<p class="shadow">123</p>
		<p class="one">只是至始至终</p>
	</body>
</html>

例如：为段落文本p添加多个阴影
P{
font-size:32px;
text-shadow:10px 10px 10px red,20px 20px 20px green;
/红色和绿色的投影叠加/
}