css教程

  • CSS如何选择第一个和倒数第一个元素

    前端新手会遇到不知道如何选择列表中的第一个和倒数第一个元素,其实这非常简单。以后所有关于CSS选择的问题,都可以直接搜索CSS选择器的手册,里面有所有的CSS选择解决方法。今天主要介绍CSS如何选择第一个和倒数第一个元素,这里就需要用到:first-child和...

    9个月前
  • less自定义变量方法

    在less开发中,less和其他编程语言一样,都有变量的概念,学会less自定义变量可以节省很多开发时间。如何自定义less变量使用符号@ 例如:@blue:#5B83AD;@FontSize:16px;@之后的变量名随意自取,:后面就是变量的值如何使用less变量color:@bluefont-size:@fontS...

    9个月前
  • CSS !important优先权重

    !important介绍支持版本:CSS1支持浏览器:大于IE6语法:Selector{sRule!important;}功能:提升指定样式规则的应用优先权。示例代码:div{color:#f00!important;color:#000;}输出颜色#f00div{color:#f00!important;}div{color:#000;}输出颜色#f00...

    281年前
  • CSS3实现苹果灵动岛效果

    主要利用了CSS3-animation + JS实现效果,只是提供思路,具体细节可以参考<!DOCTYPE html><html> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <title>灵动岛</title>...

    1年前
  • CSS伪类选择符大全

    选择符版本简介E:linkCSS1设置超链接a在未被访问前的样式。E:visitedCSS1设置超链接a在其链接地址已被访问过时的样式。E:hoverCSS1/CSS2设置元素在其鼠标悬停时的样式。E:activeCSS1/CSS2设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样...

  • CSS3旋转/放大/移动动画效果代码

    效果一:360°旋转 修改rotate(旋转度数).img1 {transition: All 0.4s ease-in-out;-webkit-transition: All 0.4s ease-in-out;-moz-transition: All 0.4s ease-in-out;-o-transition: All 0.4s ease-in-out;}.img1:hover {transform: rotate(360deg)...

  • 过年给网站加一对灯笼CSS代码

    马上快过年了,给网站加一对红灯笼,这样才有过年的喜庆劲儿。灯笼是代码生成的无需图片,而且还会摆动。使用方法把HTML下面代码粘贴到网页BODY内任意位子都可以。灯笼的位子可以微调.deng-box的left和right数值。CSS代码<!-- 灯笼代码 --><div class="de...

    1年前
  • CSS网页变灰色代码方法分享

    CSS网页变灰色代码方法分享

    发生重大哀悼事件时候,很多网站都将网站变灰色以示哀悼。在此我的站长站给大家总结了两种CSS网页变灰色代码方法,分享给大家。CSS filter方法直接写在BODY里面,只需要将css代码:filter: grayscale(10...

    341年前
  • content字符图标大全分享

    各种箭头图形样式用于HTML(在字符前加 &#)用于 CSS (在字符前加 \) 和 JavaScript(在字符前加 \u)⇠867221E0⇢867421E2⇡867321E1⇣867521E3↞8606219E↠860821A0↟8607219F↡860921A1←85922190→85942192↑85932191↓85952193↔85962194↕85972195⇄8...

    841年前
  • 左侧固定宽度,右侧随浏览器自适应宽度的CSS代码

    左侧固定宽度,右侧随浏览器自适应宽度的布局在后台框架、左图右文的样式中经常用到。左边固定200PX,右侧宽度随浏览器缩放自动调整大小,我的站长站分享几种实现方法,代码尽量精简,只留关键代码。方法1、左浮动,右margin-left比较推荐的方法,兼容性高,代码也...

    1年前