阶一、HTML基础标记及属性

最新推荐文章于 2024-09-12 19:13:21 发布

森滴滴滴滴滴滴

最新推荐文章于 2024-09-12 19:13:21 发布

阅读量328

点赞数

文章标签： html

本文链接：https://blog.csdn.net/weixin_46439490/article/details/104904994

版权

HTML……/HTML
标记文档开始与结尾

head……/head
标识HTML文档头部（只可出现一次）

a. title……/title
网页的标题（只可出现一次）

<!DOCTYPE html>
<html>
	<head>
		<title>我的网页！</title>
	</head>

	<body>
		七月的第一个代码哟~
	</body>
</html>

Body……/Body
HTML文档主体部分（只可出现一次）

1、<!……>
注释
2、BR
换行
3、p……/p
换段

**属性**
align=“left/right/center”
段落对齐方式

**注：**BR标记单纯换行
p标记还会多空出一行

 <body>
  这一段文字用的是BR<br>
  这一段文字用的是BR
  这一段文字用的是p<p>
  这一段文字用的是<p></p>
 </body>

与的区别
4、center……/center
文本居中
5、hr
插入水平线
6、hn……/hn
设置标题，n越大级别越小，且自动换行
属性
a、align=“left/right/center”
b、size=”2px（默认）“
c、width=“50px/100%（默认）”
d、color=”red“

 <body>
  <h1>这一段文字用的是h1</h1>
  <h7>这一段文字用的是h7</h7>
 </body>

n越大，字体越小
7、font……/font
设置字体，字号以及字体颜色
属性
face：设置字体类别
文本内容

size：设置字体字号
<font size="2">文本内容</font>

color：设置字体颜色
<font color="red">文本内容</font>

<body>
  <font face="楷体" size="7" color="green">
  终于漂泊好久的船停靠在你怀里<br>
  依旧还会给我海阔天空的勇气<br>
  </font>
  <font size="1" color="#00f">
  当分离 终有一天会相聚<br>
  </font>
  <font size="+">
  我的心还守在你这里<br>
  </font>
</body>

font及其属性
8、pre……/pre
原样显示标记

<body>
	<pre>终于以约为期让我在今生
	遇见你
	~
	</pre>
</body>

原样显示

文本控制标记
9、b……/b
strong……/strong（xhtml推荐）
加粗
10、I……/I
em……/em（xhtml推荐）
倾斜
11、u……/u
ins……/ins（xhtml推荐）
下划线
12、s……/s
del……/del（xhtml推荐）
删除线

13、img
图像标记
属性：
a、src（url）
指定文件位置和文件名称
b、alt（文本）
图像的替换文本（当图片不能显示是就显示定义的文本）
c、title（文本）
鼠标悬停在图片上显示的文字
d、border（数字）
添加图像的边框，设置边框宽度（边框颜色通过HTML不能实现）
e、align（top，left，right，middle）
设置图像对齐方式
f、width和 hight（像素）
设置图像的宽度和高度（设置一个，另一个则会根据比例调整）
g、vspace和hspace（像素）
设置图像的垂直边距和水平边距
注意：
相对路径：不带盘符，以自身为起点，按层级关系描述
…/上一级

绝对路径：带盘符
如：C:\Web\url

<body>
	<img src="相对路径/绝对路径">
</body>

14、特殊符号标记

a、   空格
&nbsp；       /各浏览器对空格的解析有异，推荐使用css样式代替
b、<小于
&lt；
c、>大于
&gt；
d、&和号
&amp；
e、人民币
&yen；
f、版权
&copy；
g、注册商标
&reg；
h、摄氏度
&deg；
i、正负号
&plusmn；
j、乘号
&times；
k、除号
&divide；
l、平方2（上标2）
&sup2；
m、平方3（上标3）
&sup；

15、常用图像格式
a、GIF
支持动画、支持透明（全透明+全不透明）、无损压缩、色彩单一
适用于：logo
b、PNG（png-8，png-24，png-32）
不支持动画、支持alpha透明（全透明+半透明+全不透明）、比GIF体积小
c、JPG
不支持动画、有损压缩、颜色多（25种）
注意：小图片考虑PNG，半透明考虑PNG-24，照片考虑JPG

任务：制作图文混排页面
阶段任务