:target 用于选取当前活动的目标元素

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

    <style>

       :target{

            background:red;

       }

    </style>

</head>

<body>

<a href="#con1">链接一</a>

<a href="#con2">链接二</a>

<div id="con1">内容一</div>

<div id="con2">内容二</div>

</body>

</html>

效果：点击链接一，内容一变红 ； 点击链接二，内容二变红

css3:target页内跳转的更多相关文章

  1. 常用Markdown公式整理 && 页内跳转注意 && Markdown preview

    目录: 常用Markdown公式及注意事项 标题 列表 链接 区块 代码块 / 引用  粗体和斜体 文字块 图片 表格 横线 页内跳转注意事项 其他重要需注意 Markdown preview 前提: ...

  2. Markdown页内跳转实现方法

    目录 Markdown页内跳转实现方法 HTML锚点跳转 生成目录 Markdown页内跳转实现方法 [时间:2017-02] [状态:Open] [关键词:markdown,标记语言,页内跳转,ht ...

  3. MarkDown技巧：两种方式实现页内跳转

    MarkDown技巧:两种方式实现页内跳转 本人邮箱:JohnTsai.Work@gmail.com,欢迎交流讨论. 欢迎转载,转载请注明网址:http://www.cnblogs.com/JohnT ...

  4. MarkDown 的两种页内跳转方法！！！！！

    页面内跳转就是点击某个文本,能够跳转到页面里指定的其他地方,经常用于目录中. 第一种是利用Html5 比如点击Feature, 跳转到features中 MarkDown: [Feature](#1) ...

  5. Html5 锚 <a>的页内跳转, name=abc herf=#abc

    锚点是网页制作中超级链接的一种,又叫命名锚记.命名锚记像一个迅速定位器一样是一种页面内的超级链接,运用相当普遍. 英文名:anchor 使用命名锚记可以在文档中设置标记,这些标记通常放在文档的特定主题 ...

  6. html 页内跳转

    第一种 <a href="#div1">to div1</a> //跳转链接<div id="div1">div1</ ...

  7. 关于锚点页内链接跳转出现问题(不响应,没有反应)的解决方法(ZT)

    我们知道,利用锚点可以实现页面链接跳转,也可以实现同一页面内的跳转功能. 例如:<a href="somepage.htm>某页面链接</a>  可以跳转链接到som ...

  8. markdown文本内跳转

    Markdown文本内跳转 构建茅的过程中使用markdown语法,类似于markdown向外跳转链接,目的地地址写成#. 在markdown文本中写入: 目录 跳转 跳转部分按照html文本的写法 ...

  9. markdown实现页内目录跳转

    1.实现页内目录跳转 语法: 页面首部添加目录:[目录](#jump_id) 页面内部锚点:<span id='jump_id'>标题</span>

随机推荐

  1. java 参数化类型

    package com.gxf.collection; import java.util.LinkedList; public class TestForT<T> { private Li ...

  2. 巧用 .NET 中的「合并运算符」获得 URL 中的参数

    获取 URL 中的 GET 参数,无论用什么语言开发网站,几乎是必须会用到的代码.但获取 URL 参数经常需要注意一点就是要先判断是否有这个参数存在,如果存在则取出,如果不存在则用另一个值.这个运算称 ...

  3. BICEP单元测试计划-四则运算-测试

    一.6个值得测试的具体部位,他们能够提高你的测试技巧 Right-结果是否正确? B-是否所有的边界条件都是正确的? I-能查一下反向关联吗? C-能用其他手段交叉检查一下结果吗? E-你是否可以强制 ...

  4. BICEP单元测试计划——四则运算Ⅱ

    一.测试方法(Right-BICEP) 6个值得测试的具体部位: Right-结果是否正确? B-是否所有的边界条件都是正确的? I-能查一下反向关联吗? C-能用其他手段交叉检查一下结果吗? E-你 ...

  5. 求字符串的最长回文字串 O(n)

    昨天参加了某公司的校园招聘的笔试题,做得惨不忍睹,其中就有这么一道算法设计题:求一个字符串的最长回文字串.我在ACM校队选拔赛上遇到过这道题,当时用的后缀数组AC的,但是模板忘了没写出代码来. 回头我 ...

  6. Spring Junit4 Test

    捣鼓了差不多一天...终于把"No Session found for current thread"问题解决了 环境:Spring 4.0.6 RELEASE + Hiberna ...

  7. php正则过滤html标签、空格、换行符的代码，提取图片

    $descclear = str_replace("r","",$descclear);//过滤换行 $descclear = str_replace(&quo ...

  8. 编程计算并输出1～n之间所有素数之和

    http://www.tuicool.com/articles/qaaA3i   TODO

  9. css之margin && padding讲解

    margin && padding盒子模型: margin是模块与模块的空隙,padding是内容与边框的空隙 注: 1.margin:边缘.空白 2.padding:填充 margi ...

  10. img图片底部出现莫名的下边距问题

    谷歌中这样是解释的: 图片底部的空隙实际上涉及行内元素的布局模型,图片默认的垂直对齐方式是基线,而基线的位置是与字体相关的.所以在某些时候,图片底部的空隙可能是 2px,而有时可能是 4px 或更多. ...