首页  >  文章  >  web前端  >  HTML5样式和列表、CSS链接的四种状态_html/css_WEB-ITnose

HTML5样式和列表、CSS链接的四种状态_html/css_WEB-ITnose

WBOY
WBOY原创
2016-06-24 11:32:581715浏览

一、HTML5样式

1、标签:

  

  :资源引用;

2、属性:

  type="text/css":引入文档类型;

  rel="stylesheet":外部样式表;

3、三种样式表插入方法:

  (1)外部样式表:

    在

中写入:

            //href标签处引入文档的地址

  (2)内部样式表:

    在

中写入:

      

  (3)内联样式表:

    直接在标签内部写入,例如:

      

XXX

 

 

二、HTML5列表

标签 描述
    有序列表
      无序列表
    • 列表项
      自定义列表
      自定义列表项
      描述

        1、无序列表:

          使用标签:

      • ;属性(type):disc(默认的实体圆)、circle(空心圆)、square(实体方块)、none(什么都没有)

             **若想去掉列表前面的圆点,还可用CSS样式:list-style-type:none**

          2、有序列表:

            使用标签:

        1. ;属性(type):A、a、I、i、start

            3、自定义列表:

              使用标签:

               (
          一起使用表示对话)

           

           

          三、CSS链接的四种状态

            一般用标签表示链接,可以嵌入表示跳转地址,其中表示跳转到自己

            链接有如下四种状态:

              1、a:link    普通的、未被访问的链接

              2、a:visited    用户已访问的链接

              3、a:hover     鼠标指针位于链接的上方

              4、a:active     链接被点击的时刻

            eg:

           1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>CSS链接状态</title> 6     <style type="text/css"> 7         a:link,a:visited{  8             color:#609; 9             text-decoration:none;   //去掉下划线10         }11         a:hover,a:active{ 12             color:#C00;13             text-decoration:underline;14         }15     </style>16 </head>17 18 <body>19     <a href="http://www.baidu.com">百度一下,你就知道!</a><br />20     <a href="http://www.jikexueyuan.com">学知识就到极客学院!</a>21 </body>22 </html>

              效果:

            另外,中还有属性,用来规定在何处打开链接:

              (1)target="_blank":以前页面任然存在,在新的页面打开

              (2)target="_self":在当前页面打开

              (3)target="_parent":在父级空间打开

              (4)target="_top":在顶级页面打开

            (3)(4)是

            

            **中还有name 属性,name 属性规定锚(anchor)的名称。可以使用 name 属性创建 HTML 页面中的书签,name可以用id来代替**

      声明:
      本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn