Html 当css明确定义属性为100%时，为什么宽度和高度渲染是自动的？

下面我的CSS（SCSS）清楚地将我的高度和宽度定义为100%

/*
*       SCSS
*/
a#logo {
     width: 100%;
     height: 100%;
     text-decoration: none;
     span#first-name {
          font-size: 4em;
          color: $gray;
          display: inline;
     }
     span#last-name {
          font-size: 4em;
          color: $yellow;
          display: inline;
     }
}​

/*
*       HTML
*/ 
<a id="logo" href=""><span id="first-name">justin</span><span id="last-name">BEAUDRY</span></a>​

---

height

和

width

不适用于

display:inline

（默认情况下为

）

height

和

width

不适用于

display:inline

（默认情况下为

）的未替换元素这有两个问题：

• 锚元素（a）是内联元素，因此如果不将其转换为块元素，则无法为其指定大小

---

• 在内联元素（a）中有块元素（div），它只在支持HTML5的浏览器中有效，并且只有在实际使用HTML5时才有效

---

这有两个问题：
• 锚元素（a）是内联元素，因此如果不将其转换为块元素，则无法为其指定大小

---

• 在内联元素（a）中有块元素（div），它只在支持HTML5的浏览器中有效，并且只有在实际使用HTML5时才有效

---

HA！将a元素定义为具有定义的高度和宽度的块！谢谢你，哈！将a元素定义为具有定义的高度和宽度的块！谢谢，谢谢。我会记住的。我想这会触发怪癖模式？@JustinBeaudry:不会，但浏览器会重新排列标签或添加新标签，将其转化为可以转化为元素的东西。通常情况下，在不同的浏览器中会得到不同的结果。“仅在支持HTML5的浏览器中工作”-这是所有浏览器，至少就规范的这一部分而言，至少如果您将它们设置为

display:block

“仅当您实际使用HTML5时”-浏览器不关心您使用的HTML版本。他们只关心你是否有触发标准模式的Doctype。@昆汀：在html5出现之前，还有很多浏览器已经发布了。谢谢。我会记住的。我想这会触发怪癖模式？@JustinBeaudry:不会，但浏览器会重新排列标签或添加新标签，将其转化为可以转化为元素的东西。通常情况下，在不同的浏览器中会得到不同的结果。“仅在支持HTML5的浏览器中工作”-这是所有浏览器，至少就规范的这一部分而言，至少如果您将它们设置为

display:block

“仅当您实际使用HTML5时”-浏览器不关心您使用的HTML版本。他们只关心你是否有触发标准模式的Doctype。@昆汀：在html5出现之前，还有很多浏览器已经发布了。

/*
*       SCSS
*/
a#logo {
     width: 100%;
     height: 100%;
     display: block;
     text-decoration: none;
     span#first-name {
          font-size: 4em;
          color: $gray;
          display: inline;
     }
     span#last-name {
          font-size: 4em;
          color: $yellow;
          display: inline;
     }
}​