HTML篇四

lewis 1年前 (2024-04-02) 阅读数 4 #技术

目录文件夹：即普通文件夹，里面存放的是制作页面所需要的相关素材，如：html文件、图片等。

根目录：打开目录文件的第一层就是根目录。由于页面中的图片非常多，通常会新建一个文件夹来存放这些图像文件（images）,这时再查找图像就需要采用“路径”的方式来指定图像文件的位置。

路径可分为：相对路径和绝对路径。

2. 相对路径（重点）

相对路径：以引用文件所在位置为参考基础而建立出的目录路径。简单来说就是图片相对于HTML页面的位置。

相对路径分类

符号

说明

同一级路径

图像文件位于HTML文件同一级，如<img src="happyday.png" />

下一级路径

图像文件位于HTML文件同一级，如<img src="images/happyday.png" />

上一级路径

../

图像文件位于HTML文件同一级，如<img src="../happyday.png" />

代码示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>相对路径和绝对路径学习</title>
</head>
<body>
    <h4> 同一级路径： </h4>
    <img src="happyday.png" width="200" />
    <h4> 下一级路径： </h4>
    <img src="images/studydog.png" height="200" />
    <h4> 上一级路径： </h4>
    <img src="../icecream.png" height="200" />
</body>
</html>

注意：

1.保证在相对路径正确的情况下，若浏览器未能显示图片，有可能为浏览器不兼容的原因，可以尝试换个浏览器试下~

3.绝对路径（了解即可）

绝对路径：是指目录下的绝对位置，直接到达目标位置，通常是从盘符开始的路径。由于每个人的电脑且文件夹都不同，所以不通用，故基本不使用绝对路径，但当使用的图片是网络中唯一存在的图片时，需要使用其在网络中的绝对地址进行引用。

代码示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>相对路径和绝对路径学习</title>
</head>
<body>
    <h4> 同一级路径： </h4>
    <img src="happyday.png" width="100" />
    <h4> 下一级路径： </h4>
    <img src="images/studydog.png" height="100" />
    <h4> 上一级路径： </h4>
    <img src="../icecream.png" height="100" />
    <h4> 绝对路径： </h4>
    <img src="file:///Users/regina/Code/Html/exemple/happyday.png" height="200" />
</body>
</html>

注意：

1.绝对路径和相对路径的“斜杠”不同，绝对路径是反斜杠“\”，相对路径是正斜杠“/”；

6.锚点链接

锚点链接：点击链接可以快速定位到页面中的某个位置

1）在链接文本的href属性中，设置属性值为#名字的形式，如<a href="#two"> 第二集 </a>

2）找到目标位置标签，里面添加一个id属性=刚才的名字，如<h3 id="two"> 第二集介绍 </h3>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>超链接标签学习</title>
</head>
<body>
    <h2>目录</h2>
    1 <a href="#expirence">人物经历</a><br />
    2 <a href="#live">个人生活</a><br />
    3 <a href="#composition">主要作品</a><br />
    4 <a href="#social">社会活动</a><br />
    5 <a href="#achievement">获奖记录</a><br />
    6 <a href="#appraise">人物评价</a><br />
    <h3 id="expirence">人物经历</h3>
    <p>宫崎骏1941年出生于东京都文京区，毕业于杉并区立永福小学校、杉并区立大宫中学校、东京都立丰多摩高等学校及学习院大学政治经济学院。在四个兄弟中排名第二，父亲是宫崎家族经营的“宫崎航空兴学”的职员。在第二次世界大战中因战时疏散，举家迁往宇都宫市和鹿沼市。</p>
    <p>他所在的家族经营一个飞机工厂，属于军工企业，所以战争后期物质匮乏中也能保持颇为温饱的生活，宫崎骏度过了相当自由的幼年生活。然而在这种环境下长大的宫崎骏却意外地对家族的特权产生了怀疑。宫崎骏的父亲告诉他，其实宫崎家族生产的飞机尾翼根本不符合标准，全是些没有经过正规培训的临时女工制作加工的，只需贿赂下军方管理人员，产品就可以蒙混过关。这些在大人们看来无可厚非的把戏，却在宫崎骏的内心留下了抹不去的痕迹，引发了他对人性的思考，影响了他之后从事动画导演的创作风格。宫崎骏自幼由于身体不好，故不擅长运动，也因此对静态的绘画很有天分，特别对于飞机感到兴趣，并成为终身的爱好。</p>
    <p>1958年，宫崎骏高中3年级的时候，日本史上第一部彩色动画长片《白蛇传》上映，他开始对动画产生兴趣.</p>
    <p>1959年，宫崎骏进入学习院大学政治经济部。大学里面没有漫画社，所以进入了与之最为接近的儿童文学研究会，社员只有宫崎骏一个人。在大学期间他创作了大量的漫画，也曾向贷本漫画出版社投稿，不过作品没有完结。在“安保运动”中宫崎仅仅是一个旁观者，仅仅在最后时刻作为无党派人士参加了一下。</p>
    <p>宫崎骏也在思想上开始倾向社会主义，苏联解体对他的思想构成了很大冲击，虽然面对社会主义败北的现实，但是他对劳动者和革命的肯定立场一直没变。宫崎骏在1994年连载完漫画《风之谷》后，决定放弃马克思主义。</p>
    <h3 id="live">个人生活</h3>
    <p>宫崎骏在家中四个兄弟中排行第二，其他兄弟分别是大哥宫崎新，三弟宫崎丰，四弟宫崎士郎。</p>
    <p>1965年，宫崎骏与同僚的太田朱美结婚，结婚时的主持人是1234。</p>
    <p>1967年，长男宫崎吾朗诞生，现任（财）徳间记念アニメーション文化财団理事。1970年，次男宫崎敬介诞生，木口木版画家。</p>
    <h3 id="composition">主要作品</h3>
    《龙猫》《魔女宅急便》《岁月的童话》《红猪》《百变狸猫》《OnYourMark》《侧耳倾听》《幽灵公主》《千与千寻（又名神隐少女）》《胶卷咕噜咕噜转》《捕鲸记》<br />《MeitoKonekobasu（又名：小梅与小猫巴士）》《小狗克罗历险记》《猫的报恩》《哈尔的移动城堡》等等等等·············
    <h3 id="social">社会活动</h3>
    <p>2011年3月28日，宫崎骏代表吉卜力工作室还已经为3月11日“东日本大地震”地震灾区捐款，但捐款具体数额并未透露。同年7月5日，借助NGO Peace Winds的要求，宫崎骏和庵野秀明监督一同前往高田市看望3月11日“东日本大地震”受灾群众并为灾民签名。</p>
    <p>2015年6月27日，宫崎骏出资3亿日元(约1500万元人民币)，在久米岛以南的钱田森林公园中建立该亲子设施，名为“风回家的森林”，面积约有1万平方米，地理上更因背山面海，可让小朋友接触森林自然环境，还会建设有海水流通的泳池，该设施提供足够30名亲子入住的地方，预计会于2017年春天完工。</p>
    <p>同年7月13日，在日本东京外国记者俱乐部宫崎骏出席记者会并发表讲话，敦促日本首相安倍晋三在其战后70周年谈话中承认日本曾对中国发动侵略战争，并对由此给中国人民造成的巨大苦难进行痛彻反省。宫崎骏批评推动“战争立法”是逆时代潮流。他认为，一部分日本人希望忘记过去的历史，但是日本当初发动侵略战争的行为绝对不允许被遗忘，更不容否认。他表示，任何国家都不能为寻求自身利益而发动侵略战争，这是每个国家都应遵循的最基本原则。</p>
    <h3 id="achievement">获奖记录</h3>
    <p>2014    第37届日本电影学院奖最佳动画电影奖  起风了 获奖</p>
    <p>2009    第32届日本电影学院奖最佳动画电影奖  悬崖上的金鱼姬 获奖</p>
    <p>2002    第25届日本电影学院奖最佳影片奖    千与千寻    获奖</p>
    <p>2002    第25届日本电影学院奖会长功劳奖        获奖</p>
    <p>1998    第21届日本电影学院奖最佳影片奖    幽灵公主    获奖</p>
    <p>1990    第13届日本电影学院奖话题奖-最具话题影片奖  魔女宅急便   获奖</p>
    <p>1990    第13届日本电影学院奖特别奖[15]  魔女宅急便   获奖</p>
    等等等等··························································<br />
    <h3 id="appraise">人物评价</h3>
    <p>看他的作品，就好像在人类狭窄的后脑上开了一扇广阔的天窗，让人不由自主的相信梦想的力量，因为梦想的存在是借以人与神比肩的理由。从开始以来的所有作品，宫崎骏思想是一以贯之且辩证发展着的，他的世界观，历史观，人生观和艺术观都有着明晰的脉络，最终都为了构建那个完美的宫崎骏世界而努力（第十放映室评）</p>
</body>
</html>

版权声明

本文仅代表作者观点，不代表博信信息网立场。

上一篇：杀死某个端口占用的进程下一篇：MySQL数据库基本操作（一）

HTML篇四

版权声明

作者文章