你的位置:首页 > 软件开发 > 网页设计 > HTML5样式和列表、CSS链接的四种状态

HTML5样式和列表、CSS链接的四种状态

发布时间:2015-11-25 19:00:03
一、HTML5样式1、标签:  <style>:样式定义;  <link>:资源引用;2、属性:  type="text/css":引入文档类型;  rel="stylesheet":外部样式表;3、三种样式表插入方 ...

HTML5样式和列表、CSS链接的四种状态

一、HTML5样式

1、标签:

  <style>:样式定义;

  <link>:资源引用;

2、属性:

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

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

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

  (1)外部样式表:

    在<head></head>中写入:

      <link  rel="stylesheet"  type="text/css"  href="...">      //href标签处引入文档的地址

  (2)内部样式表:

    在<head></head>中写入:

      <style  type="text/css">//这里用来编写样式</style>

  (3)内联样式表:

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

      <p >XXX</p>

 


 

二、HTML5列表

标签描述
<ol>有序列表
<ul>无序列表
<li>列表项
<dl>自定义列表
<dt>自定义列表项
<dd>描述

  1、无序列表:

    使用标签:<ul>、<li>;属性(type):disc(默认的实体圆)、circle(空心圆)、square(实体方块)、none(什么都没有)

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

  2、有序列表:

    使用标签:<ol>、<li>;属性(type):A、a、I、i、start

  3、自定义列表:

    使用标签:<dl>、<dt>、<dd>     (<dialog>与<dt>、<dd>一起使用表示对话)

 


 

三、CSS链接的四种状态

  一般用<a>标签表示链接,可以嵌入<href>表示跳转地址,其中<href="#">表示跳转到自己

  链接有如下四种状态:

    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 ="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>

 

海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com

原标题:HTML5样式和列表、CSS链接的四种状态

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。