零基础学习HTML(5)——link、base标签的使用

文章目录

官方资料
学习正文

注：学习笔记基于小甲鱼学习视频，官方论坛： https://fishc.com.cn/forum.php

官方资料

鱼C课程案例库：https://ilovefishc.com/html5/
html5速查手册：https://man.ilovefishc.com/html5/
css速查手册：https://man.ilovefishc.com/css3/

学习正文

link标签：https://man.ilovefishc.com/pageHTML5/link.html

link 元素最常见的用途是链接样式表，比如下面用于链接style元素，使HTML代码更加简洁：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>第五个程序</title><link rel="stylesheet" type="text/css" href="html/styles.css"><link rel="stylesheet" media="print" href="html/print.css"><link rel="stylesheet" media="screen and (min-width: 512px) and (max-width: 1024px)" href="html/screen.css">
</head>
<body>
<h1>一只特立独行的猪</h1>
<h2>王小波</h2>
<p>插队的时候，我喂过猪、也放过牛。假如没有人来管，这两种动物也完全知道该怎样生活。它们会自由自在地闲逛，饥则食渴则饮，春天来临时还要谈谈爱情；这样一来，它们的生活层次很低，完全乏善可陈。人来了以后，给它们的生活做出了安排：每一头牛和每一口猪的生活都有了主题。就它们中的大多数而言，这种生活主题是很悲惨的：前者的主题是干活，后者的主题是长肉。我不认为这有什么可抱怨的，因为我当时的生活也不见得丰富了多少，除了八个样板戏，也没有什么消遣。有极少数的猪和牛，它们的生活另有安排。以猪为例，种猪和母猪除了吃，还有别的事可干。就我所见，它们对这些安排也不大喜欢。种猪的任务是交配，换言之，我们的政策准许它当个花花公子。但是疲惫的种猪往往摆出一种肉猪（肉猪是阉过的）才有的正人君子架势，死活不肯跳到母猪背上去。母猪的任务是生崽儿，但有些母猪却要把猪崽儿吃掉。总的来说，人的安排使猪痛苦不堪。但它们还是接受了：猪总是猪啊。
</p>
<p>对生活做种种设置是人特有的品性。不光是设置动物，也设置自己。我们知道，在古希腊有个斯巴达，那里的生活被设置得了无生趣，其目的就是要使男人成为亡命战士，使女人成为生育机器，前者像些斗鸡，后者像些母猪。这两类动物是很特别的，但我以为，它们肯定不喜欢自己的生活。但不喜欢又能怎么样？人也好，动物也罢，都很难改变自己的命运。
</p>
<p>以下谈到的一只猪有些与众不同。我喂猪时，它已经有四五岁了，从名分上说，它是肉猪，但长得又黑又瘦，两眼炯炯有光。这家伙像山羊一样敏捷，一米高的猪栏一跳就过；它还能跳上猪圈的房顶，这一点又像是猫——所以它总是到处游逛，根本就不在圈里呆着。所有喂过猪的知青都把它当宠儿来对待，它也是我的宠儿——因为它只对知青好，容许他们走到三米之内，要是别的人，它早就跑了。它是公的，原本该劁掉。不过你去试试看，哪怕你把劁猪刀藏在身后，它也能嗅出来，朝你瞪大眼睛，噢噢地吼起来。我总是用细米糠熬的粥喂它，等它吃够了以后，才把糠对到野草里喂别的猪。其他猪看了嫉妒，一起嚷起来。这时候整个猪场一片鬼哭狼嚎，但我和它都不在乎。吃饱了以后，它就跳上房顶去晒太阳，或者模仿各种声音。它会学汽车响、拖拉机响，学得都很像；有时整天不见踪影，我估计它到附近的村寨里找母猪去了。我们这里也有母猪，都关在圈里，被过度的生育搞得走了形，又脏又臭，它对它们不感兴趣；村寨里的母猪好看一些。它有很多精彩的事迹，但我喂猪的时间短，知道得有限，索性就不写了。总而言之，所有喂过猪的知青都喜欢它，喜欢它特立独行的派头儿，还说它活得潇洒。但老乡们就不这么浪漫，他们说，这猪不正经。领导则痛恨它，这一点以后还要谈到。我对它则不止是喜欢——我尊敬它，常常不顾自己虚长十几岁这一现实，把它叫做“猪兄”。如前所述，这位猪兄会模仿各种声音。我想它也学过人说话，但没有学会——假如学会了，我们就可以做倾心之谈。但这不能怪它。人和猪的音色差得太远了。
</p>
<p>后来，猪兄学会了汽笛叫，这个本领给它招来了麻烦。我们那里有座糖厂，中午要鸣一次汽笛，让工人换班。我们队下地干活时，听见这次汽笛响就收工回来。我的猪兄每天上午十点钟总要跳到房上学汽笛，地里的人听见它叫就回来——这可比糖厂鸣笛早了一个半小时。坦白地说，这不能全怪猪兄，它毕竟不是锅炉，叫起来和汽笛还有些区别，但老乡们却硬说听不出来。领导上因此开了一个会，把它定成了破坏春耕的坏分子，要对它采取专政手段——会议的精神我已经知道了，但我不为它担忧——因为假如专政是指绳索和杀猪刀的话，那是一点门都没有的。以前的领导也不是没试过，一百人也治不住它。狗也没用：猪兄跑起来像颗鱼雷，能把狗撞出一丈开外。谁知这回是动了真格的，指导员带了二十几个人，手拿五四式手枪；副指导员带了十几人，手持看青的火枪，分两路在猪场外的空地上兜捕它。这就使我陷入了内心的矛盾：按我和它的交情，我该舞起两把杀猪刀冲出去，和它并肩战斗，但我又觉得这样做太过惊世骇俗——它毕竟是只猪啊；还有一个理由，我不敢对抗领导，我怀疑这才是问题之所在。总之，我在一边看着。猪兄的镇定使我佩服之极：它很冷静地躲在手枪和火枪的连线之内，任凭人喊狗咬，不离那条线。这样，拿手枪的人开火就会把拿火枪的打死，反之亦然；两头同时开火，两头都会被打死。至于它，因为目标小，多半没事。就这样连兜了几个圈子，它找到了一个空子，一头撞出去了；跑得潇洒之极。以后我在甘蔗地里还见过它一次，它长出了獠牙，还认识我，但已不容我走近了。这种冷淡使我痛心，但我也赞成它对心怀叵测的人保持距离。
</p>
<p>我已经四十岁了，除了这只猪，还没见过谁敢于如此无视对生活的设置。相反，我倒见过很多想要设置别人生活的人，还有对被设置的生活安之若素的人。因为这个原故，我一直怀念这只特立独行的猪。
</p>
<img src="html/Pig.png">
</body>
</html>

/*css里这么注释*/
/*style.css*/
body{background-image: url("background.png");
}
h1{text-align: center;color: white;
}
h2{margin-left:60%;color: white;
}
p{font-size: 16px;text-indent: 32px;color: white;
}
img{position: absolute;left: 50%;margin-left: -181px;
}

/*print.css*/
h1 {color: black;
}
h2 {color: black;
}
p {color: black;
}

/*screen.css*/
body{background-image: url("back2.png")
}

显然，运行效果都是一样的：

注1：原本放在style元素中的样式，若放在外部css文件中，则HTML和css中均不用再写style元素。
注2：这里踩到了一个坑，因为我将css文件与图片放在了同一个文件夹下，所以css里的图片url就直接“name.png”就可以直接调用，即：css文件里的链接地址是以此css文件为相对路径的。

同时，link标签还可以用于连接网站图标。

<link rel="icon" type="image/x-icon" href="html/favicon.ico">  <!--网页左侧的图标-->

base标签：https://man.ilovefishc.com/pageHTML5/base.html

base标签用于用于设置相对URL的解析基准。

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>第五个程序</title><link rel="stylesheet" type="text/css" href="html/styles.css"><link rel="stylesheet" media="print" href="html/print.css"><link rel="stylesheet" media="screen and (min-width: 512px) and (max-width: 1024px)" href="html/screen.css"><link rel="icon" type="image/x-icon" href="html/favicon.ico"><base href="http://demo.fishc.com/html5/lesson4/" target="_blank">
</head>
<body><a href="test1">第一个例子</a> <!--相当于：http://demo.fishc.com/html5/lesson4/test1--><a href="test2">第二个例子</a><a href="test3">第三个例子</a>
</body>
</html>

注1：base标签只会影响相对路径，如果有绝对路径则不影响。

零基础学习HTML(5)——link、base标签的使用相关推荐

salesforce零基础学习（八十九）使用 input type=file 以及RemoteAction方式上传附件
在classic环境中,salesforce提供了<apex:inputFile>标签用来实现附件的上传以及内容获取.salesforce 零基础学习(二十四)解析csv格式内容中有类似的 ...
Docker零基础学习笔记
零基础学习Docker Docker官方文档基础语法 docker pull: 从DockerHub上拉取镜像 $ docker pull ngnix Using default tag: late ...
零基础学python需要多久-零基础学习Python大概要多久，感悟分享？
在互联网时代编程无处不在,它存在于我们生活和工作之中,可以说哪里有通讯,哪里有互联网就一定会有编程.由于Python软件比较简便,因而Python已经成为,编程人员乐于选择的一款软件,这款软件的语言比 ...
python零基础实例-零基础学习Python开发练习100题实例（1）
零基础学习Python开发练习100题实例(1) 2018-02-25 09:37:59 2864浏览 1.题目:有四个数字:1.2.3.4,能组成多少个互不相同且无重复数字的三位数?各是多少? 程序 ...
python基础代码事例-零基础学习Python开发练习100题实例（2）
零基础学习Python开发练习100题实例(2) 2018-02-26 13:11:39 1934浏览 11.题目:古典问题:有一对兔子,从出生后第3个月起每个月都生一对兔子,小兔子长到第三个月后每个 ...
html5代码_干货篇！零基础学习HTML5要用到的6款开发工具
HTML5不是一种编程语言,而是一种标记语言,是程序员开发网页必用的一种开发工具.目前来说HTML5技术是非常火爆的,而且有专家预估在未来的10年HTML技术都不会过时.HTML5前景好,来学HTML ...
零基础学习hadoop到上手工作线路指导（中级篇）
2019独角兽企业重金招聘Python工程师标准>>> 此篇是在零基础学习hadoop到上手工作线路指导(初级篇)的基础,一个继续总结. 五一假期:在写点内容,也算是总结.上面我们会 ...
零基础学python要多久-零基础学习Python大概要多久，感悟分享？
在互联网时代编程无处不在,它存在于我们生活和工作之中,可以说哪里有通讯,哪里有互联网就一定会有编程.由于Python软件比较简便,因而Python已经成为,编程人员乐于选择的一款软件,这款软件的语言比 ...
python入门经典100题-零基础学习Python开发练习100题实例（1）
零基础学习Python开发练习100题实例(1) 2018-02-25 09:37:59 2854浏览 1.题目:有四个数字:1.2.3.4,能组成多少个互不相同且无重复数字的三位数?各是多少? 程序 ...

零基础学习HTML(5)——link、base标签的使用

文章目录

官方资料

学习正文

零基础学习HTML(5)——link、base标签的使用相关推荐

最新文章

热门文章