整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

前端教程:JavascriptString.cons

前端教程:JavascriptString.constructor属性

将返回一个对创建实例的原型字符串函数。

语法

string.constructor1复制代码类型:[javascript]

下面是参数的详细信息:

NA

返回值

返回创建此对象的实例的功能。

例子:

<html>
<head>
<title>JavaScript String constructor Method</title>
</head>
<body>
<script type="text/javascript">
   var str=new String( "This is string" );
   document.write("str.constructor is:" + str.constructor); 
</script>
</body>
</html>1234567891011复制代码类型:[javascript]

这将产生以下结果:

str.constructor is: function String() { [native code] } 

「链接」

、zoom属性概述

zoom属性是IE浏览器中特有的一个样式属性,其作用主要是用来解决IE6以下版本的浏览器中,absolute或relative定位的容器因为子元素使用float造成高度塌陷的问题。

zoom属性是一个继承属性,只能作用于块级元素。该属性不能用于非IE内核的浏览器,因此在编写跨浏览器的CSS样式时,需要考虑到使用其他兼容方法。

二、zoom属性的语法

zoom属性可以使用具体的值或百分比值作为其属性值,例如:

div{
    zoom: 1;
}

在实际编码中,zoom属性一般使用zoom:1或zoom:100%来进行设置,这样会把容器元素的缩放比例设为1,达到修复IE浏览器下的高度塌陷问题的效果。

三、zoom属性的使用场景

zoom属性通常与IE6及以下版本的浏览器中出现的高度塌陷问题有关联。当一个容器元素设置了相对或绝对定位,并且其内部的子元素又使用了浮动(float)属性时,容器元素的高度就会无法被子元素撑开,出现高度塌陷问题。

此时,为容器元素添加 zoom:1; 就可以修复这个问题。具体例子如下:

.container {
    position: relative;
    zoom: 1;
}
.container .child {
    float: left;
}

四、zoom属性的兼容性问题

需要注意的是,虽然zoom属性非常实用,但是该属性只在IE浏览器中有效,在非IE浏览器中并不具备任何效果。

如果需要在跨浏览器的开发中兼容IE浏览器的高度塌陷问题,可以考虑使用其他方式,如引入jQuery库中的clearfix插件或直接利用触发BFC的方式进行处理。

五、小结

在IE6以下版本的浏览器中,zoom属性是一个非常实用的样式属性,其可以很好地解决定位元素高度塌陷的问题。通过该属性的使用,在确保代码兼容性的前提下,我们可以更加灵活地进行CSS样式的编写。

TML元素

这一节以及以后几节我们将对HTML中<body>标签中的各种元素进行一个概述,并对一些基本元素进行练习。

HTML元素:指的是从开始标签到结束标签的所有代码。

举个例子,在《第一个HTML页面如何写?——零基础自学网页制作》这一节中,我们写了这样一个页面"第一个页面.html"。后面的练习我们都在这个文件中进行。

<!DOCTYPE HTML> 
  <html> 
  <head> 
  </head> 
  <body> 
  <h>第一个网页</h>
  <p>千里之行始于足下</p> 
  </body>
  </html>

其中"<h>第一个网页</h>"整个代码就可以看做是一个html元素,<h></h>叫做标题标签,加上"第一个网页"这段文字共同构成一个HTML元素。

HTML元素非常多,因为我们可以在页面中显示各种各样的信息,不同的信息载体对应不同的元素。

下面我们就介绍几个常用的html元素。

HTML常用元素使用练习1

NO.1:<h></h>与<hr>

<h></h>这个用来添加标题的元素大家比较熟悉了,这里要介绍一个新的用法。示例代码如下:

<!DOCTYPE HTML>
  <html>
  <head> 
  <title>第一个网页</title>
  </head> 
  <body>
  <h1>第一个网页</h1>
  <h2>第一个网页</h2>
  <h3>第一个网页</h3>
  <h4>第一个网页</h4>
  <h5>第一个网页</h5>
  <h6>第一个网页</h6>
  <p>千里之行始于足下</p>
  </body> 
  </html>

页面显示效果如图:

大家通过观察可以看出h后面的编号用来控制标题字号大小,仅仅是标题有这种预设,其他元素如果要调整字号的话我们放在以后CSS里讲。

下面看<hr>,示例代码如下:

<!DOCTYPE HTML>
  <html>
  <head> 
  <title>第一个网页</title>
  </head> 
  <body>
  <h1>第一个网页</h1><hr>
  <h2>第一个网页</h2><hr>
  <h3>第一个网页</h3><hr>
  <h4>第一个网页</h4><hr>
  <h5>第一个网页</h5><hr>
  <h6>第一个网页</h6><hr>
  <p>千里之行始于足下</p><hr>
  </body> 
  </html>

效果如下:

<hr>标签可以为它前面的元素添加分割线,大家注意的是分割线不是下划线,添加下划线的操作我们会在CSS样式表中详细讲解。

NO.2:<p></p>与<br>

<p></p>元素是添加段落的。示例代码如下:

<!DOCTYPE HTML>
  <html>
  <head> 
  <title>第一个网页</title>
  </head> 
  <body>
  <h1>第一个网页</h1><hr>
  <p>千里之行始于足下值得注意的是我们没有必要一一讲解HTML中的所有元素以及每个元素的各个属性,
因为每个元素的使用都是大同小异,我们完全可以通过几个常用案例对HTML全部元素及属性的指定形成一
个整体认识,以后可以根据需求通过查询手册来自己学习其他元素及其属性的用法。</p><hr>
</body>
</html>

效果如图所示:

通过观察发现,即使我们在代码中对段落的文字进行回车操作,但是出现在页面中是没有回车的效果的,文字按照顺序长长的排列在显示器上,非常不利于阅读,因此我们就要介绍常常和p标签连用的<br>换行标签。

示例代码如下:

<!DOCTYPE HTML>
  <html>
  <head>
  <title>第一个网页</title>
</head> 
<body>
  <h1>第一个网页</h1><hr>
<p>千里之行始于足下<br>
  值得注意的是我们没有必要一一讲解HTML中的所有元素以及每个元素的各个属性,<br>
  因为每个元素的使用都是大同小异,我们完全可以通过几个常用案例对HTML全部元<br>
  素及属性的指定形成一个整体认识,以后可以根据需求通过查询手册来自己学习其他<br>
  元素及其属性的用法。</p><hr>
</body>
</html>

效果如图所示:

喜欢的小伙伴请关注我,阅读中遇到任何问题请给我留言,如有疏漏或错误欢迎大家斧正,不胜感激!

HTML完整学习目录

HTML序章(学习目的、对象、基本概念)——零基础自学网页制作

HTML是什么?——零基础自学网页制作

第一个HTML页面如何写?——零基础自学网页制作

HTML页面中head标签有啥用?——零基础自学网页制作

初识meta标签与SEO——零基础自学网页制作

HTML中的元素使用方法1——零基础自学网页制作

HTML中的元素使用方法2——零基础自学网页制作

HTML元素中的属性1——零基础自学网页制作

HTML元素中的属性2(路径详解)——零基础自学网页制作

使用HTML添加表格1(基本元素)——零基础自学网页制作

使用HTML添加表格2(表格头部与脚部)——零基础自学网页制作

使用HTML添加表格3(间距与颜色)——零基础自学网页制作

使用HTML添加表格4(行颜色与表格嵌套)——零基础自学网页制作

16进制颜色表示与RGB色彩模型——零基础自学网页制作

HTML中的块级元素与内联元素——零基础自学网页制作

初识HTML中的<div>块元素——零基础自学网页制作

在HTML页面中嵌入其他页面的方法——零基础自学网页制作

封闭在家学网页制作!为页面嵌入PDF文件——零基础自学网页制作

HTML表单元素初识1——零基础自学网页制作

HTML表单元素初识2——零基础自学网页制作

HTML表单3(下拉列表、多行文字输入)——零基础自学网页制作

HTML表单4(form的action、method属性)——零基础自学网页制作

HTML列表制作讲解——零基础自学网页制作

为HTML页面添加视频、音频的方法——零基础自学网页制作

音视频格式转换神器与html视频元素加字幕——零基础自学网页制作

HTML中使用<a>标签实现文本内链接——零基础自学网页制作