一、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 style="color:red">XXX</p>

　　（4）导入样式：

　　　　导入样式有6种写法：

@import mystyle.css;

@import 'mystyle.css';

@import "mystyle.css";

@import url(mystyle.css);

@import url('mystyle.css');

@import url("mystyle.css");

　　导入样式要写在<head></head>标签的<style>标签里面。而且必须将@import导入样式放在其他定义的样式前面。

　　（4）样式优先级：

　　行内样式>内嵌样式>外部样式

二、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：

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>CSS链接状态</title>

     <style type="text/css">

         a:link,a:visited{

             color:#609;

             text-decoration:none;   //去掉下划线

         }

         a:hover,a:active{

             color:#C00;

             text-decoration:underline;

         }

     </style>

 </head>

 <body>

     <a href="http://www.baidu.com">百度一下，你就知道！</a><br />

     <a href="http://www.jikexueyuan.com">学知识就到极客学院！</a>

 </body>

 </html>

　　　　效果：

　　另外，<a>中还有<target>属性，用来规定在何处打开链接：

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

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

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

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

　　(3)(4)是<iframe>配合<a>标签的使用效果

　　

　　**<a>中还有name 属性，name 属性规定锚（anchor）的名称。可以使用 name 属性创建 HTML 页面中的书签，name可以用id来代替**

HTML5样式和列表、CSS链接的四种状态的更多相关文章

  1. CSS控制a标签链接的四种状态

    /*CSS链接的四种状态 *a:link 普通的.未被访问的链接样式 *a:visited 用户已访问的链接样式 *a:hover 鼠标指针位于链接上方样式 *a:active 链接被点击的时刻样式 ...

  2. ccs中a链接的四种状态

    什么是超链接? 超链接通俗地指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序.而在一个网页中 ...

  3. a链接的四种状态

    四种状态:hover.link.active.visible a:link{color:#fff;} a链接初始化 a:hover{color:yellow;} 把鼠标放上去的状况 a:active{ ...

  4. CSS超链接常见四种状态在控制

    一.首选设置一下以下4种状态常: 1.a:active是超级链接的初始状态 2.a:hover是把鼠标放上去时的状况 3.a:link 是鼠标点击时 4.a:visited是访问过后的情况.

  5. CSS简单的四种引入方式

    CSS一共有四种引入方式 (1)最简单的两种方式是直接在html标签里面引入,或者在html文件前面声明,以下是简单的代码示例 <!DOCTYPE html> <html lang= ...

  6. css中按钮的四种状态

    css中按钮有四种状态 1. 普通状态2. hover 鼠标悬停状态3. active 点击状态4. focus 取得焦点状态 .btn:focus{outline:0;} 可以去除按钮或a标签点击后 ...

  7. HTML与CSS结合的四种方式

    HTML与CSS结合的四种方式: 方式一:每个标签加一个属性: 例如:<div style="background-color:red; color: green"> ...

  8. >hibernate的四种状态

    hibernate的四种状态 1.临时状态 与数据库中没有相对应的数据,也不在session的管理之中,一般是新new出来的对象 2.持久化状态 对象在session的管理中,最后会在事务提交后,在数 ...

  9. Hibernate的session缓存和对象的四种状态

    一.session缓存 说session缓存就得说到JAVA对象的生命周期,当没有任何引用指向一个对象时,对象则可以被gc回收,也就是生命周期结束了 而hibernate获取一个对象后,会将对象存入s ...

随机推荐

  1. setTimeout()和setInterval() 何时被调用执行

    定义 setTimeout()和setInterval()经常被用来处理延时和定时任务.setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则可以在每隔 ...

  2. [leetCode][012] Two Sum (1)

    [题目]: Given an array of integers, find two numbers such that they add up to a specific target number ...

  3. 如何下载某些 flash 在线视频 并使用ffmpeg下载分段并加密的m3u8视频流

    有些网站使用 flash 在线播放视频,不方便进行下载. 可以使用 Chrome 的 Developer Tools 模拟成 iOS 设备(通过修改 User Agent),然后取得 h.264 视频 ...

  4. 运行时（iOS）

    运行时(iOS)   一.什么是运行时(Runtime)? 运行时是苹果提供的纯C语言的开发库(运行时是一种非常牛逼.开发中经常用到的底层技术) 二.运行时的作用? 能获得某个类的所有成员变量 能获得 ...

  5. 项目部署到Tomat报错:jar not loaded.See Servlet Spec 2.3, section 9.7.2. Offending

    项目部署到Tomcat报这样的异常: Java代码   jar not loaded. See Servlet Spec 2.3, section 9.7.2. Offending class: ja ...

  6. Javascript 笔记与总结（2-11）暴力操作节点

    innerHTML 代表节点内的内容,能读能写 虽然不是 W3C 规定的标准,但是各浏览器都支持得很好 [例] <!DOCTYPE html> <html lang="en ...

  7. DirectX 基础学习系列6 字体

    DIRECTX9自带ID3DXFONT类 内部调用GDI的接口,效率一般,但能够处理一些复杂的字体 HRESULT D3DXCreateFontIndirect( LPDIRECT3DDEVICE9 ...

  8. 连接别人创建的ORACLE数据库

    以oracle10g版本为例,本机必须安装oralce10g的客户端或oralce10g的服务器 方法一(从服务器配置): 第一步:打开配置和移植工具-->Net Manager 第二步:选中服 ...

  9. 看StackOverflow如何用25台服务器撑起5.6亿的月PV

    问答社区网络 StackExchange 由 100 多个网站构成,其中包括了 Alexa 排名第 54 的 StackOverflow.StackExchang 有 400 万用户,每月 5.6 亿 ...

  10. Why Stored Procedures?

    http://www.w3resource.com/mysql/mysql-procedure.php Stored procedures are fast. MySQL server takes s ...