Front-End Notes: Draw a horizontal line in HTML and a CSS file that can be referenced by IE10,

Source: Internet
Author: User

Front-End Notes: Draw a horizontal line in HTML and a CSS file that can be referenced by IE10,

First of all, happy National Day ~~~ This is my first national day outside the province. After all, I graduated this year ~~~

Recently, I will continue to summarize the front-end knowledge used in the previous WEB project and share it with you ~~~

How can we draw a horizontal line? I think of three methods, but they have different styles.

1.


It's easy.

2. <div> to construct, we know that border is the meaning of a boundary. In many cases, we use it to set some edge borders. Here we use it, check the code (or insert a horizontal line between a and B ):

:

A little popular. 1px indicates how wide the line is. The bigger the wider the width, the solid indicates that it is a solid line. There are many attributes such as dashed and groove, for details, see Border HTML. Of course # CCC is the color.

3. it is constructed by <div>, but by using border-bottom. Why is it so used? the horizontal line we often use is actually an attribute under a div, rather than a single attribute, the Code has changed as follows:

:


Today, when I was helping a friend build a website, I put the written CSS into an external css file for reference. However, when Firefox and Google browsers are normally displayed, IE10 cannot be displayed, then I found the website information. Here I would like to thank Baidu for learning the solution provided by a netizen (rendering with IE8) and testing IE6 with IETester ~~~ :

In

<META http-equiv = "X-UA-Compatible" content = "IE = 8"/>


These are all in the 14-inch notebook 100% Web browser effect.

Now, I wish you a happy National Day holiday !~~~

(For reprinted articles on this site, please indicate the author and SourceCoderExtraordinary. Do not use it for any commercial purposes)





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.