HTML5 four states for styles and lists, CSS links

Source: Internet
Author: User

One, HTML5 style

1. Tags:

<style>: style definition;

<link>: resource reference;

2. Properties:

Type= "Text/css": Introduction of document type;

Rel= "stylesheet": external style sheet;

3, three style sheet insert method:

(1) External style sheet:

Write in

       <link rel= "stylesheet" type= "Text/css" href= "..." > //HREF Tags introducing the address of the document

(2) Internal style sheet:

Write in

      <style type= "Text/css" >//is used here to write styles </style>

(3) Inline style sheet:

Write directly inside the label, for example:

<p style= "color:red" >XXX</p>

Ii. List of HTML5

Label Describe
<ol> Ordered list
<ul> Unordered list
<li> List items
<dl> Custom list
<dt> Custom list Items
<dd> Describe

1. Unordered list:

Use label:<ul>, <li>; attribute (type): disc (default solid circle), Circle (empty circle), Square (solid block), none (Nothing)

* * If you want to remove the dots in front of the list, you can also use CSS styles: list-style-type:none**

2. Ordered list:

Use label:<ol>, <li>; attribute (type): A, a, I, I, start

3. Custom list:

Use tags:<dl>, <dt>, <dd> (<dialog> and <dt>, <dd> use to represent conversations)

Third, the CSS link four kinds of states

General use of <a> tags for the link, you can embed

Links have the following four statuses:

1. A:link Common, inaccessible links

2, a:visited user has visited the link

3. A:hover the mouse pointer over the link

4. The moment when the a:active link is clicked

eg

1 <!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd ">2 <HTMLxmlns= "http://www.w3.org/1999/xhtml">3 <Head>4 <Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" />5 <title>CSS Link State</title>6     <styletype= "Text/css">7 a:link,a:visited{ 8 Color:#609;9 text-decoration:None;//To drop the dashTen         } One a:hover,a:active{  A Color:#C00; - text-decoration:Underline; -         } the     </style> - </Head> -  - <Body> +     <ahref= "Http://www.baidu.com">Baidu a bit, you will know!</a><BR/> -     <ahref= "Http://www.jikexueyuan.com">Learn the knowledge on the Geek Academy!</a> + </Body> A </HTML>

Effect:

In addition, there are <target> properties in,<a> that specify where to open the link:

(1) target= "_blank": previous page still exists, open in new page

(2) target= "_self": Open on current page

(3) target= "_parent": Open in parent space

(4) target= "_top": Open on top page

(3) (4) is the use effect of <iframe> cooperation <a> label

  

There is also the Name property in **<a>, which specifies the names of anchors (anchor). You can use the Name property to create bookmarks in an HTML page, and name can be used instead of * *

HTML5 four states for styles and lists, CSS links

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.