WP主题制作-第10课:十六进制代码和样式链接

从一开始就遵循此  WordPress主题教程系列。

继昨天的CSS简介之后,我们将做更多的  着色,  并详细了解  十六进制代码。color属性后跟一个十六进制(十六进制)代码,用于为文本(单词)着色。例如,正文{color:#000000;}表示页面正文中的所有文本(单词)均为黑色。

background属性,后跟一个十六进制代码,用于为非文本内容着色。例如,  body {背景:#ffffff; }  表示正文为白色背景。

十六进制代码

  • 在每个井字代码前加井号(#)的前六位。这些数字的范围从  #ffffff  (白色)到  #000000  (黑色)。
  • #ffffff,#eeeeee,#dddddd,#cccccc,#bbbbbb,#aaaaaa,#999999,#888888,#777777,#666666,#555555,#444444,#333333。#222222,#111111
  • 前两位代表红色,第二位和第四位代表绿色,后两位代表蓝色。 #ff0000  为红色。 #550000  是深红色。 #220000  为深红色。 #00ff00  为绿色。 #0000ff  是蓝色的。等等,黄色不是原色吗?哪个十六进制代码是黄色的? #ffff00  为黄色。 #ff00ff  是紫色的。

第1步

body {}  选择器下键入以下代码  :

a:link,a:visited { 
text-decoration:下划线;
颜色:#336699; 
}

样式链接
  • 那是干什么用的? 您确保所有链接都带有下划线(text-decoration:underline;)和蓝色(颜色:#336699;)。它是蓝色的另一种阴影,它是蓝色的,因为最后两位数字(代表蓝色)是最高的数字。
  • a:link  用于样式化链接。当您想将单词变成链接时,使用什么?该  <A>  和  </A>  标签,因此,    中  一:链接
  • 答:访问  是已经被点击,关于(访问的页面),因此样式化链接,  访问  的  一个:拜访
  • 而不是键入:
    a:link { 
    text-decoration:下划线;
    颜色:#336699; 
    }
    a:已访问{ 
    文字修饰:下划线;
    颜色:#336699; 
    }
  • 您 在应用  text-decoration:下划线时使用  逗号  分隔  了a:link  和  a:visited  和  颜色:#336699;  到两个选择器。

第2步

a:link,a:visited {}下键入以下代码 

a:hover { 
文本修饰:无;
}

那是干什么用的? 您确保将光标悬停在链接上时链接下划线消失,因此将光标  悬停  在  a:hover上

如果您不希望默认情况下带有下划线并在悬停时带下划线,请 为a:link  和  a:hover切换  text-decoration:值  。

如果要在悬停时更改链接的颜色,请添加  color:  以及所需的任何十六进制代码。例如:

a:hover { 
文本修饰:无;
颜色:#ff0000;
}

未经允许不得转载:创之梦博客 » WP主题制作-第10课:十六进制代码和样式链接

赞 (0)
分享到:更多 ()

欢迎各位吐槽评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址