前端开发

 首页 > 前端开发 > css教程 > CSS学习笔记二 - html/css语言栏目:html.css - 自学

CSS学习笔记二 - html/css语言栏目:html.css - 自学

分享到:
【字体:
导读:
          我们浏览网站的时候,会点击一些链接,这些链接在点之前,点之后有不同的效果,这些效果就是用伪元素选择器做的伪元素选择器:就是在httml中预先定义好一些选择器,成为伪元素 26684;式:标...

我们浏览网站的时候,会点击一些链接,这些链接在点之前,点之后有不同的效果,这些效果就是用伪元素选择器做的


伪元素选择器:


就是在httml中预先定义好一些选择器,成为伪元素

格式:标签名:伪元素:类标签名.类名:伪元素


超链接的状态:

a :link : 超链接未点击状态

a :visited 被访问后状态

a :hover 光标移到超链接上的状态(未点击)->鼠标悬停

a :active 点击超链接时的状态

使用顺序:L - V - H - A,点击前和点击后是一个状态

最好用IE浏览器测验,有的浏览器可能看不到效果

 


段落标签也有如上的效果

p:first-line : 段落的第一行文本

p:first-letter :段落中的第一个字母

:focus :具有焦点元素 (ps:IE6不支持,FIrefox,google可以看到效果)

    
伪元素选择器演示

CSS样式的结合应用:

css可以和html中众多的标签结合使用

    asd
        姓名:
        年龄:
div区域

单元格二
单元格三 单元格四

  • 你好
  • 你好
  • 你好
  • 你好


分享到:
CSS高效开发实战:CSS 3、LESS、SASS、Boo...
技术的新发展,除计算机可以接入互联网之外,平板电脑、智能手机、智能电视等其他设备均可访问互联网。在多设备时代,构建多屏体验也不是听说的那么难。 但是这也增加了学习CSS的难度?不知道如何上手,只懂一点基础的CSS语法,在移动互联时代,难道我们就这样落伍了??好好学习吧,看完《CSS高效开发实战:CSS 3、LESS、SA...
css3中关于伪类的使用 - html/css语言栏...
目标: css中after伪类,last-child伪类的使用。以及部分css3的属性。 过程: 在制作导航时,经常会遇到在每一个li后面添加一个分割符号,到最后一个元素的时候,分割符就会去掉的一种效果。 如图 那么制作这样的一个效果,怎么用纯css很简单的完成了。这里用到了css的伪类。 html部分 Home About Me Portfo...
  •         php迷,一个php技术的分享社区,专属您自己的技术摘抄本、收藏夹。
  • 在这里……