.1.4 窗口大小

// 得到页面宽度
var width=window.innerWidth;
// 得到页面高度
var height=window.innerHeight;
// 只能对通过window.open()打开的,并且只有一个tab页面进行调整大小
window.resizeTo(500,500);

8.1.5 导航和打开窗口

window.open(url)

1）、当只有一个url参数时，会在新的页面打开url，并且新页面呈在最前面

var url="https://www.baidu.com";
window.open(url);

2）、第二个参数代表页面打开的方式：

window.open(url,"_self");    // 以当前页面打开新的url
window.open(url,"__parent"); // 加载到父框架
window.open(url,"__top");    // 替换任何可加载的框架集
window.open(url,name);       // 窗口名称
window.open(url,"_blank");  // 在新的页面打开url，并且新页呈现在最前面

3）、如果是新弹出窗口，那么第三个参数是用来设置新窗口的一些属性与元素，包含有以下属性：

fullscreen、height、width、left、tpp、location、menubar、resizable、scrollbars、status、toolbar

以下为使用举例：

var url=“xxxxxxxx”;
window.open(url,"_blank","fullscreen=yes,height=200,width=200,left=100,top=200");

window.open()打开新窗口后，会返回一个窗口对象，可对其设置各种属性，还可以关闭：winobj.close()，不过close()方法只能用于使用open()该当打开的窗口。

4）、如果返回的窗口对象为null，那么大可能是有弹出口屏蔽程序。

　用HTML怎么制作网页呢?静态网站的编写主要是用HTML DIV+CSS JS等来完成页面的排版设计 ? ,常用的网页设计软件有Dreamweaver、EditPlus、HBuilderX、VScode 、Webstorm、Animate等等，用的最多的还是DW，当然不同软件写出的前端Html5代码都是一致的。

　　一、网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。

　　二、网站程序方面：计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器，已达到打开后就能即时看到网站的效果。

　　三、网站素材方面：计划收集各大平台好看的图片素材，并精挑细选适合网页风格的图片，然后使用PS做出适合网页尺寸的图片。

　　四、网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件;

　　五、网页编辑方面：网页作品代码简单，可使用任意HTML编辑软件(如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作)。 其中： (1) html文件包含：其中index.html是首页、其他html为二级页面; (2) css文件包含：css全部页面样式,文字滚动, 图片放大等; (3) js文件包含：js实现动态轮播特效, 表单提交, 点击事件等等(个别网页中运用到js代码)。

　　更多关于“用HTML怎么制作网页呢?”的问题，欢迎咨询千锋教育在线名师。千锋教育拥有多年IT培训服务经验，采用全程面授高品质、高体验培养模式，拥有国内一体化教学管理及学员服务，助力更多学员实现高薪梦想。

知道吗？其实网页中有很多种图片格式，例如网页中有一种图片格式叫做 PNG，或者有一种图片叫 JPEG，还有另外一个名字叫 JPEG。

网页中其实还有很多其他种图片的格式，比如 GIF，GIF 一般是用来表示动图的，而 AVIF 或者 WebP 这些格式可能大部分同学并没有在网页中过多的去关注过，甚至还有一些 SVG 或者 BMP 的图片也有，这些可能不是大多数同学所经常去关注的图片格式。

今天会在网页代码中去实现自己通过引入一张图片来在网页中进行展示。图片是通过图片标签进行引入的，写一个图片标签，在 src 属性里面去写入当前图片的地址，当前图片地址可以用点斜杠表示。

当前去找到 test.jpg 的图片，找到之后就可以在浏览器中进行预览，通过浏览器进行打开就会发现图片已经展示在浏览器中了，但是这张图片实在是太大了。

可以通过改变代码标签中的"width"属性来修改图片大小，把它改成 100 宽，这个 100 宽就是指 100px 的意思，但是图片又变得太小了，怎么办？可以继续去修改它大小，把它变成 300。

修改完宽度之后发现图片是按比例进行伸缩的，也就是说即使不去修改它的 height 高度也能够放大和缩小，但是一旦手动控制了它的 height 就被压缩了，所以 height 可以不去设置。如果设置一定要提前知道这张图片的宽高比例，随意修改一个宽高都会导致图片进行的变形。