Blog code: iframe-pages embedded in other pages

Source: Internet
Author: User

An IFRAME is a very useful code that can embed another page in a Web page. For a good web page, it is convenient to move it to your blog, using this code is the most appropriate. And for some of the Web page effects and code that are not supported in Sina Blog, you can set them up in support of their website, or upload to a free network space or network hard drive, get the corresponding web address, and then embed the IFRAME in the Sina blog, very easy to use!


one, fixed location of the IFRAME code:

<div align=center><iframe src= "http://weather.265.com/weather.htm" frameborder=0 marginwidth =0 marginheight=0 scrolling=no style= "width168:px;height:50px;" width=168 height=50 scrolling=no allowtransparency= "true" ></IFRAME></DIV>

The effect is as follows:


Description: This is an example of an application embedded with a weather forecast. This effect is most commonly used. which

1, "http://weather.265.com/weather.htm " is the address of the embedded Web page;
2.width= "168px" height= "50px"For the width and height of the embedded Web page, the larger the value, the greater the range; To hide the embedded content, you can set both values to 0;
3.scrolling= "No"The scrolling settings for the embedded Web page, which can be set to allow scrolling to scrolling= "yes" when the content range is large.allowtransparency= "true"To allow transparent settings, change true to no for opacity. Same below
4, frameborder=0 for the embedded page border settings, 0 means no border, 1 for the border thickness, the larger the size of the border thicker. Same below
5. Marginwidth=0 marginheight=0 sets the distance embedded in the Web page to the margin, and 0 indicates the borderless distance. Same below

Sina Blog How to add code-Http://blog.sina.com.cn/u/471d02de01000awe

Second, you can change the location of the embedded page content iframe code:

<div style= "left:0px; Position:absolute; top:0px "Align=center>

<iframe src= "Http://blog.sina.com.cn/edaifengliu" frameborder=0 width=1024 style= "width1024:px;height : 12000px; "Scrolling=no height=12000 allowtransparency=" true "></IFRAME>

</DIV>

(effect slightly)

Description: This is an example of an application that embeds another page in the homepage of a blog, to be used on the homepage. The secret lies in<div style= "left:0px; Position:absolute; top:0px "Align=center>In thestyle= "left:0px; Position:absolute; top:0px "'s settings. The code setting that determines the location of the various page elements can be used to change the display of various elements in a Web page. which

1, left:0px The numeric value determines the left-hand distance of the embedded page content, and the larger the value, the farther away from the left edge of the page;

2, top:0pxThe value determines the distance from the top edge of the embedded page content, the larger the value, the farther away from the page boundary;

3.Position:absolute;Setting an absolute position for the embedded page is quite important. In addition, the relative position of the setting is to put absolute to relative, but this less use for the better.

another:

Here's an HTML -enabled The blog site of the code (including the SCRIPT type Code) and how to use the various code in the blog. The blog is an educational blog, just a few years ago, by the provincial education department head, the National Education Department, 100% effective and stable, not like free space, today can be free to use, may not be free to use tomorrow. However, the blog site is an educational blog, can not send inappropriate content, or will be sealed bo.

Tip: Click on the image to enlarge

1. Registration:
Click below to open the website and select "Register Blog":

http://blog.cersp.com/

2, enter e-mail to register, remember the account number and password:

http://blog.sina.com.cn/main/html/showpic.html#url=http://s9.album.sina.com.cn/pic/471d02de0200195k

3, Login blog, select the configuration :

http://blog.sina.com.cn/main/html/showpic.html#url=http://s10.album.sina.com.cn/pic/471d02de0200195l

Note: must be placed in the HTML code <head> .... <Head> or <body> </body > is effective between the special effects code, such as status bar code, mouse effects code, etc., must be pasted in the blog's " site logo " or " Masthead Bulletin " Code edit box, otherwise the effect is invalid.

4, "OK", get the address of this blog, embedded in the following code :

<div align=center><iframe src=http://blog.cersp.com/7901870.aspx style= "width:0px; Height:0px "width=0 height=0> </div>

Replace the address in the blue part of the code with the address you want, and if you don't hide the embedded content, the width and height of the content to be displayed:0px;height:0px is set to the appropriate size.

5. Continue to enter the content in this blog post :

http://blog.sina.com.cn/main/html/showpic.html#url=http://s10.album.sina.com.cn/pic/471d02de02001979

6. Use various HTML codes in this blog post :

http://blog.sina.com.cn/main/html/showpic.html#url=http://s11.album.sina.com.cn/pic/471d02de0200197a

7. After the same "OK", obtain the address of this blog post, embedded in the following code :

<div align=center><iframe src=http://blog.cersp.com/7901870.aspx style= "width:0px; Height:0px "width=0 height=0> </div>

Replace the address in the blue part of the code with the address you want, and if you don't hide the embedded content, the width and height of the content to be displayed:0px;height:0px is set to the appropriate size.

Attention:

1, in order to visually harmonize, in the blog post to the other blog embedded in the article, choose White background style simple template, and in the article, in the source code editing State, the article code to the following code to paste back, so that the article close to the top left corner of the page. The code is as follows:

The Blue part of the value is the width and height of the content, according to the size of the embedded blog page, to be able to be embedded in the blog page full display of the size (Sina blog width not more than 495px ).

2, content and effects set up after publishing, get the address of the published article, using the following set of embed code to embed the Web page into your blog:

<div align=center><iframe style= "width:496px; height:1525px"marginwidth=0 marginheight=0 src="http://blog.cersp.com/7901870/1121792.aspx" Frameborder=0 scrolling=no></iframe></div>

The Blue part is the width and height of the embedded Web page, and the red part is the content of the Web page you want to embed.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.