前端-学习笔记(一)

博客皆个人学习过程中整理,如有问题,欢迎大家指正。
本文链接: https://blog.csdn.net/qq_42017331/article/details/102634669

1. 基本内容:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>系统登陆</title>
</head>
<body>

</body>
</html>

DOCTYPE:非HTML标签内容,而是向浏览器指明编写页面所用标记的版本
html lang = “en” :向浏览器表明该页面是html编写的,并且语言为英文网页。lang表示language,en表示english。

2. CSS样式格式

在这里插入图片描述
代码示例:

body{
	padding-top: 15pt;
	padding-left: 100pt;
	padding-right: 100pt;
}
img.right{
	float: right;
	padding: 10pt;
}
img.left{
	float: left;
	padding: 10pt;
}
p.right{
	color: #2F4F4F;
	padding-left: 380pt;
}

<!DOCTYPE html>
<html>
<head>
	<title>HTML学习(一)</title>
	<link rel="stylesheet" type="text/css" href="test_1.css">
</head>
<body background="image/13.jpg">
	<h1>大熊猫</h1>
	<hr>
	<div>
		<img class="right" src="image/0.jpg" width="400pt" height="200pt">
		<p>
			大熊猫(学名:Ailuropoda melanoleuca):属于食肉目、熊科、大熊猫亚科和大熊猫属唯一的哺乳动物,
			头躯长1.2-1.8米,尾长10-12厘米。体重80-120千克,最重可达180千克,体色为黑白两色,
			它有着圆圆的脸颊,大大的黑眼圈,胖嘟嘟的身体,标志性的内八字的行走方式,
			也有解剖刀般锋利的爪子。是世界上最可爱的动物之一。
		</p>
		<p>
			大熊猫已在地球上生存了至少800万年,被誉为“活化石”和“中国国宝”,世界自然基金会的形象大使,
			是世界生物多样性保护的旗舰物种。据第三次全国大熊猫野外种群调查,全世界野生大熊猫不足1600只,
			属于中国国家一级保护动物。截止2011年10月,全国圈养大熊猫数量为333只。大熊猫最初是吃肉的,
			经过进化,99%的食物都是竹子了,但牙齿和消化道还保持原样,仍然划分为食肉目,
			发怒时危险性堪比其它熊种。野外大熊猫的寿命为18-20岁,圈养状态下可以超过30岁。截至2018年11月,圈养大熊猫种群数量达到548只
		</p>
		<p>
			大熊猫是中国特有种,现存的主要栖息地是中国四川、陕西和甘肃的山区。
		</p>
		<p>
			(概述图片参考资料来源: 视觉中国  )
		</p>
	</div>
	<div>
		<img class="left" src="image/10.png">
		<img class="right" src="image/1.jpg" width="400pt" height="200pt">
		<br><br><br><br><br><br>
	</div>
	<div class="left">
		<h1>物种学史</h1>
		<h3>进化历史</h3>
		<img class="right" src="image/6.jpg" width="400pt" height="200pt">
		<p>
			大熊猫的历史可谓源远流长。迄今所发现的最古老大熊猫成员——始熊猫的化石出土于中国云南禄丰和元谋两地,
			地质年代约为800万年前中新世晚期。在长期严酷的生存竞争和自然选择中,和它们同时代的很多动物都已灭绝,
			但大熊猫却是强者,处于优势,成为“活化石”保存到了今天。<br><br>
			大熊猫的祖先是始熊猫(Ailuaractos lufengensis),大熊猫的标准中文名称其实叫“猫熊”,意即“像猫一样的熊”。
			这是一种由拟熊类演变而成的以食肉为主的最早的熊猫。始熊猫的主支则在中国的中部和南部继续演化,
			其中一种在距今约300万年的更新世初期出现,体形比熊猫小,从牙齿推断它已进化成为兼食竹类的杂食兽,卵生熊类,
			此后这一主支向亚热带扩展,分布广泛在华北、西北、华东、西南、华南以至越南和缅甸北部都发现了化石。在这一过程中,
			大熊猫适应了亚热带竹林生活,体型逐渐增大依赖竹子为生。在距今50-70万年的更新世中、晚期是大熊猫的鼎盛时期。
			生活中的大熊猫的臼齿发达,爪子除了五趾外还有一个“拇指”。这个“拇指”其实是一节腕骨特化形成,学名叫做“桡侧籽骨”,主要起握住竹子的作用。
		</p>
	</div>
	<div>
		<br><br><br><br>
	</div>
	<p class="right">
		京ICP证030173号  京公网安备11000002000001号 
	</p>
</body>
</html>

CSS(层叠样式表):一种定义样式构造的语言,用于描述如何格式化和显示Web页面上的信息。
样式规则:Web页面元素的格式化命令。其包括改变元素布局,以及元素显示的大小、形状、颜色。样式表又分为内部样式表和外部样式表。
外部样式表:
存放在单独的文件中,通过下述代码引用。

<link rel="stylesheet" type="text/css" href="test_1.css">

内部样式表:

<!DOCTYPE html>
<html>
<head>
	<title>HTML学习(二)</title>
	<style type="text/css">
		div.test{
			color: #ff0000;
		}
	</style>
</head>
<body>
	<div class="test">
		<p>hello world</p>
	</div>
</body>
</html>

定义在< style > < /style>标签内,其他同外部样式表相同。
< span>< /span>类似< div>< /div>,但是不会换行。如下例所示:

<p style="color: #ff0000"> hello <span style="color: #000000">world</span> hello world</p>

再例如,实现以下效果:
在这里插入图片描述

<h1>熊猫 <span style="font-size: 16pt">(哺乳动物)</span></h1>

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_42017331/article/details/102634669