href is a Hypertext Reference, which means a hypertext reference, which is used to establish a link between the current element and the document. The common tags that use the href attribute are a and link.
<link rel="stylesheet" href="css/style.css">
When the browser executes this line of code in sequence, it downloads the linked document in parallel without stopping the processing of the current document. Therefore, the loading of css is generally to use link instead of @import to load css.
src is source, and src represents an introduction. The content pointed to by src is embedded in the document where the current tag is located. The tags that are often used in src are: img, script.
<img src="../img/love.png"/>
<script type="text/javascript" src="js/main.js"></script>
When the browser parses this line, it will temporarily stop the browser's rendering of the current document until the src resource of the changed line is loaded. So we generally put the js script file at the bottom of the body instead of the head section.
conclusion: src replaces the current element by introducing a resource, and href is used to establish the connection between the current document and the referenced resource.