首页 > 代码库 > 5.8心得
5.8心得
1、查href和src的区别
src 的内容,是页面必不可少的一部分,是引入。href 的内容,是与该页面有关联,是引用。区别就是,引入和引用。
src和href之间存在区别,能混淆使用。src用于替换当前元素,href用于在当前文档和引用资源之间确立联系。
src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内,例如js脚本,img图片和frame等元素。
<script src ="http://www.mamicode.com/js.js"></script>
当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
href是Hypertext Reference的缩写,指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,如果我们在文档中添加
<link href="http://www.mamicode.com/common.css" rel="stylesheet"/>
那么浏览器会识别该文档为css文件,就会并行下载资源并且不会停止对当前文档的处理。这也是为什么建议使用link方式来加载css,而不是使用@import方式。
2、placeholder在IE上和谷歌能显示的一样
由于placeholder是html5的新属性,可想而知,仅支持html5的浏览器才支持placeholder,目前最新的firefox、chrome、safari以及ie10都支持,ie6到ie9都不支持。
可以看出,placeholder的文字在各个浏览器下基本都是淡灰色显示。
不同的地方在于,在ff和chrome下,输入框获得焦点时,placeholder文字没有变化,只有当输入框中输入了内容时,placeholder文字才消失;而在safari和ie10下,当输入框获得焦点时,placeholder文字便立即消失。
默认情况下,placeholder的文字是灰色,输入的文字是黑色。
3、什么是块元素,什么是内联元素及特点
1.块级元素,默认是独自占据一行的。比如是<p>、<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<ul>、<ol>、<dl>、<pre>、<hr />
2.内联元素,默认是几个内联元素都可以在同一行上显示。比如是<a>、<span>等。
打个比方,<a>本来是内联的,但好多时候做导航栏把它要设置为块。
块级元素在屏幕上显示时,将换行,如同存在回车或换行符一样例如,<p>、<h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<ul>、<ol>、<dl>、<pre>、<hr />、< 内联元素在浏览器中显示时不会换行以下元素都是内联元素:<b>、<i>、<u>、<em>、<strong>、<sup>、<sub>、<big>、<small>、<li>、<ins>、<del>、<code>、<cite>、<dfn>、<kbd>和<var>。
4、<fieldset>、<legend>标签的意思和用法
<fieldset>标记定义了一个表单控件组,通过将相关联的控件分组,可以把表单分为更小,更易于管理。
<fieldset>标记必须以<legend>开头,以提供控件组的标题,在<legend>后可包含任何行内标记或者块标记,
甚至嵌套<fieldset>。
<legend>标记定义该控件组的标题,且必须在<fieldset>标记中。它的accesskey属性定义了按钮的单字快捷键,
使用户能够更快的跳到目标控件组。
例如:
<fieldset>除了可以用style设定他的样式以外,谁知道他还有什么其他纯html中自代的属性吗?
</fieldset>
<fieldset><legend>基本信息</legend> </fieldset>
<fieldset id=b><legend id=a><span style="width:150;filter:shadow(color=ffedff)">意想不到的效果不错</span></legend><small><p>不知道他还有其他的属性吗?</small></fieldset>
<fieldset><legend accesskey="F" align="center"><u>F</u>ieldset的属性</legend>
<div style="word-break:break-all;font-size:12px;line-height:16px;padding:10px;">
CLASS=classname<br>
ID=value<br>
LANG=language<br>
LANGUAGE=JAVASCRIPT | JSCRIPT | VBSCRIPT | VBS <br>
STYLE=css1-properties<br>
TITLE=text<br>
EVENT = script<br>
</div></fieldset>
<fieldset><legend accesskey="L" align="center"><u>L</u>egend的属性</legend>
<div style="word-break:break-all;font-size:12px;line-height:16px;padding:10px;">
<label accesskey="U"><u>U</u>uu: <input type="test" name="isaac" size="10" maxlength="15"></label><br>
ALIGN=BOTTOM | CENTER | LEFT | RIGHT | TOP<br>
CLASS=classname<br>
ID=value<br>
LANG=language<br>
LANGUAGE=JAVASCRIPT | JSCRIPT | VBSCRIPT | VBS<br>
STYLE=css1-properties<br>
TITLE=text<br>
VALIGN=BOTTOM | TOP<br>
EVENT= script<br>
</div></fieldset>
5.8心得