这篇文章给大家聊聊关于10天从零开始学习网页制作第二天属性介绍（下），以及对应的知识点，希望对各位有所帮助，不要忘了收藏本站哦。
还有一个知识点需要补充。前半部分，图片的路径都是本地路径。如果我们想加载互联网上的某个图像怎么办？这个其实更简单。可以直接将图片的地址写入src中，如下图：
例如，这是一个在线图片地址：
https://avatar.csdnimg.cn/B/C/8/0_ming_147.jpg
代码如下：
代码
效果如下：
影响
让我们继续下面的课程。什么是属性？其实就是一些附加信息，比如一个人，他的附加信息，包括姓名和年龄。所以对于标签来说，属性就是它的附加信息。需要注意的一点是，属性写在标签中，也就是start标签中，虽然不区分大小写，但尽量与标签保持一致，使用小写字母；该属性是一个键值对，语法如下：
键='值'。
看到上面的语法，我们是不是想到了第一天讲的img标签的用法呢？你还记得吗？里面是不是还有一个属性，src，如下图：
财产
事实上，大多数属性都是以这种方式呈现的。一般用双引号，有时也用单引号。单引号和双引号的表达式是一致的。我们以新建一个网页并引入一张图片为例，如下图：
目录
代码如下：
代码
效果如下：
影响
一个非常简单的例子，只展示一张图片。在实际开发中，我们一般控制图片的大小，即图片的宽度和高度。毕竟有些图片太大，直接显示影响美观。如何控制宽度和高度？这里需要属性，宽度属性：wdith，高度属性：height。我们分别使用它们：
将图片的宽度调整为100px。 Px是像素，是一个单位。我们将在下一课中解释它。这里，我们先了解一下px可以写也可以不写。默认单位是像素。
代码如下：
代码
效果如下：
影响
有的朋友要问了，我明明只写了宽度，没有写高度。为什么会出现这样的情况呢？每个人都需要明白这一点。如果我们只需要写宽度，或者只写高度，
然后对于img标签，它会根据你指定的大小按比例缩放或放大另一个img标签。也就是说原图宽100px，高100px。你重写了width 属性，设置width='20px' ，那么高度也会变成20px，是等比例处理。
我们再看一个例子，同时设置宽度和高度：
代码如下：
代码
效果如下：
影响
如果两个属性都设置了，那么它将根据您的设置显示。图像可以被拉伸或压缩。出现这种情况是因为您的图像太大或太小。在实际开发中，我们也必须考虑到这种情况。一般UI都会为我们标记图片的大小或者比例。如果我们按照UI标记来写，就不会有问题。
以上两个是img的属性。事实上，这并不难。它只是控制宽度和高度。需要注意的是，我们使用空格来分隔多个属性。我们再看另一个属性，alt属性，alt属性用来为图片定义一串准备好的可替换文本。这是什么意思？是图片无法加载，或者加载错误时显示的文字信息，如下图。我们故意写错了图片的地址：
代码
因为我们没有“life1.png”图片，所以加载肯定是错误的。我们看一下效果：
影响
代码
效果如下：
影响
2.a标签和属性的使用
我们经常看到，在很多网页上，点击图片或者某个文字会跳转到另一个页面，比如淘宝、京东等。点击商品后，会跳转到商品详情、今日头条或网易新闻。点击某条新闻，将跳转新闻详情。如何实现这一目标？事实上，大多数都可以使用标签来实现。
a 标签是一个超链接。超链接可以是一个单词、一个单词、一组单词或一个图像。我们可以点击这些内容来跳转到新文档或者当前文档中的某个点。部分，当我们将鼠标指针移动到网页中的链接上时，箭头会变成一只小手。
我们先看一下效果。 href是a标签的属性，用来跳转的地址，类似于img标签的src属性，是指向的路径。
代码
效果如下：
影响
因为href为空，所以当前的点击没有任何效果。我们来练习跳跃吧。这里我们分为两种，一种是网络地址跳转，一种是本地文件跳转。
第一种，网络地址跳转
我们直接跳转到百度首页，代码如下：
代码
右键单击并选择在浏览器中打开：
浏览器打开
点击跳转百度后，会直接打开百度首页。你可以尝试一下。我不会在这里发布图片。
二、本地文件跳转
目前“a tag.html”和“Remote Image Loading.html”属于同一目录。在代码中我们直接写入文件名。
目录
“a tag.html”中的代码如下：
代码
效果如下：
影响
点击后：
用户评论
这篇文章讲的太浅了！属性介绍应该更深入，比如说不同标签使用的属性有哪些区别？
有11位网友表示赞同！
终于入门啦！第一天学完基础，今天继续学习属性就感觉世界打开了！
有12位网友表示赞同！
我刚开始学习网页制作才一天，发现属性好难记啊！希望以后可以多一些记忆方法和例子，这样更容易理解。
有13位网友表示赞同！
这篇博客写的真不错！把属性介绍得很清晰，让我这个零基础的小白更容易理解。期待后续内容!
有16位网友表示赞同！
我学过一点html的语法，但是属性很多都还不熟练，今天看这篇文章就明白了好多地方！
有11位网友表示赞同！
感觉学习网页制作真的很有成就感！第一天才刚搞懂标签，今天又学会了属性，下一步我要尝试自己设计个简单的页面！期待看到成品!
有18位网友表示赞同！
对于属性的介绍可以更具实践性，例如给一些具体的应用案例，让读者更容易理解属性的功能和作用。
有18位网友表示赞同！
属性真的太复杂了！我觉得可以把每个属性都单独展开一节，这样会更容易记忆。多来点图示说明也更好!
有9位网友表示赞同！
我很喜欢这种一步步的教学方式，从基础到属性再到具体的应用，循序渐进。期待学习更多网页制作知识!
有10位网友表示赞同！
感觉这篇文章不太适合新手，我目前连标签都还没学会好，跳跃到这里感觉很难跟上
有14位网友表示赞同！
这个零基础10天学会网页制作系列很棒！每天都能学到新知识，让我对网页制作充满兴趣和动力。希望可以持续更新!
有17位网友表示赞同！
为什么不直接用一些案例代码来讲解属性的使用呢？这样能更直观地理解效果，而不是看文字解释感觉很抽象。
有9位网友表示赞同！
今天看了这篇文章以后才明白原来属性在网页设计中作用这么大！期待下篇文章继续学习!
有8位网友表示赞同！
希望作者可以多分享一些常用的属性和标签的组合使用方式，这样就能更快速地掌握网页制作技能。
有7位网友表示赞同！
我的目标是做一个全栈工程师，学习网页制作只是其中一部分。这系列的文章帮助我入门了，继续加油!
有15位网友表示赞同！
属性真的很多啊！希望能根据不同标签分类讲解，方便理解和记忆。例如：div元素的属性、img元素的属性等等,这样更有条理!
有7位网友表示赞同！
对于零基础小白来说，这篇文章节奏稍微快了一点，我希望可以更多地解释概念背后的原理，而不是只关注属性的使用方法。
有15位网友表示赞同！
学习网页制作需要大量的实践操作，理论知识只是一个基础。这个系列的文章可以帮助我打下基础，期待后续可以分享一些实战案例!
有20位网友表示赞同！
感觉学习网页制作越来越有趣了！从最初的 html 标签到现在的属性，让我看到了网页设计的无限可能性.
有19位网友表示赞同！