5.8随笔

1.<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>

显示效果为:


除了可以用style设定他的样式以外,谁知道他还有什么其他纯html中自代的属性吗?基本信息 意想不到的效果不错不知道他还有其他的属性吗?
Fieldset的属性
CLASS=classname
ID=value
LANG=language
LANGUAGE=JAVASCRIPT | JSCRIPT | VBSCRIPT | VBS
STYLE=css1-properties
TITLE=text
EVENT = script
Legend的属性
Uuu:
ALIGN=BOTTOM | CENTER | LEFT | RIGHT | TOP
CLASS=classname
ID=value
LANG=language
LANGUAGE=JAVASCRIPT | JSCRIPT | VBSCRIPT | VBS
STYLE=css1-properties
TITLE=text
VALIGN=BOTTOM | TOP
EVENT= script

 

2.src和href区别

[标签]src和href之间存在区别,能混淆使用。src用于替换当前元素,href用于在当前文档和引用资源之间确立联系。

src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内,例如js脚本,img图片和frame等元素。

<script src ="js.js"></script>

当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
href是Hypertext Reference的缩写,指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,如果我们在文档中添加

<link href="common.css" rel="stylesheet"/>

那么浏览器会识别该文档为css文件,就会并行下载资源并且不会停止对当前文档的处理。这也是为什么建议使用link方式来加载css,而不是使用@import方式。

src和href之间存在区别,能混淆使用。src用于替换当前元素,href用于在当前文档和引用资源之间确立联系。

src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内,例如js脚本,img图片和frame等元素。

<script src ="js.js"></script>

当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
href是Hypertext Reference的缩写,指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,如果我们在文档中添加

<link href="common.css" rel="stylesheet"/>

那么浏览器会识别该文档为css文件,就会并行下载资源并且不会停止对当前文档的处理。这也是为什么建议使用link方式来加载css,而不是使用@import方式。

src和href之间存在区别,能混淆使用。src用于替换当前元素,href用于在当前文档和引用资源之间确立联系。

src是source的缩写,指向外部资源的位置,指向的内容将会嵌入到文档中当前标签所在位置;在请求src资源时会将其指向的资源下载并应用到文档内,例如js脚本,img图片和frame等元素。

<script src ="js.js"></script>

当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕,图片和框架等元素也如此,类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
href是Hypertext Reference的缩写,指向网络资源所在位置,建立和当前元素(锚点)或当前文档(链接)之间的链接,如果我们在文档中添加

<link href="common.css" rel="stylesheet"/>

那么浏览器会识别该文档为css文件,就会并行下载资源并且不会停止对当前文档的处理。这也是为什么建议使用link方式来加载css,而不是使用@import方式。

3.placeholder

由于placeholder是html5的新属性,可想而知,仅支持html5的浏览器才支持placeholder,目前最新的firefox、chrome、safari以及ie10都支持,ie6到ie9都不支持。
如果直接写input{color:red;},可以看到,ie10和ff下,placeholder文字和输入文字都变成了红色,而在chrome和safari下,placeholder文字颜色不变,只有输入的文字变成红色。

 4.块元素与内元素

块级元素:block element 
每个块级元素默认占一行高度,一行内添加一个块级元素后无法一般无法添加其他元素(float浮动后除外)。两个块级元素连续编辑时,会在页面自动换行显示。块级元素一般可嵌套块级元素或行内元素;
块级元素一般作为容器出现,用来组织结构,但并不全是如此。有些块级元素,如<form>只能包含块级元素。其他的块级元素则可以包含 行级元素如<P>.也有一些则既可以包含块级,也可以包含行级元素。
DIV 是最常用的块级元素,元素样式的display:block都是块级元素。它们总是以一个块的形式表现出来,并且跟同级的兄弟块依次竖直排列,左右撑满。

内联元素又名行内元素(inline element),和其对应的是块元素(block element),都是html规范中的概念。内联元素的显示,为了帮助理解,可以形象的称为“文本模式”,即一个挨着一个,都在同一行按从左至右的顺序显示,不单独占一行。而当加入了css控制以后,块元素和内联元素的这种属性差异就不成为差异了。比如,我们完全可以把内联元素加上display:block这样的属性,让它也有每次都从新行开始的属性,即成为块元素同样我们可以把块元素加上display:inline这样的属性,让它也在一行上排列。

特点:

1、和其他元素都在一行上;
2、高度、行高和顶以及底边距都不可改变;
3、宽度就是它的文字或图片的宽度,不可改变。
总的来说,内联元素一般都是基于语义级(semantic)的基本元素,它只能容纳文本或者其他内联元素,通常被包括在块元素中使用,常见内联元素有“a、b、br”等。
 
posted @ 2017-05-08 21:14  云随风走  阅读(95)  评论(0编辑  收藏  举报