Css
css3系列之伪类选择器
Pseudo-ClassesSelectors(伪类选择器) E:not(s) E:root E:target E:first-child E:last-child E:only-child E:nth-child(n) E:nth-last-child(n) 这上面一...
css画爱心并实现“爱心跳动”
第一次写博客，来记录自己在前端上的成长，并且希望能够借鉴到其他大神的经验来提高自己的水平。这次打算用css来画一个爱心并实现“爱心跳动”的功能，下面如果有表述不正确的叙述，欢迎各位大神前来指导~ css画爱心并实现“爱心跳动”用到了以下相关知识点：背景图片、定位、C...
CSS设置滚动条样式
1.::-webkit-scrollbar滚动条整体部分，其中的属性:width,height,background,border等。2.::-webkit-scrollbar-button滚动条两端的按钮，可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。3.::-webkit-scro...
CSS中zoom属性的作用
这里介绍一下CSS中的Zoom属性，这个属性一般不为人知，甚至有些CSS手册中都查询不到。但经常会在一些css样式中看到它出现。Zoom属性是IE浏览器的专有属性，Firefox等浏览器不支持。它可以设置或检索对象的缩放比例。除此之外，它还有其他一些小作用，比如触发ie的hasLayout属性，清除浮动、清除margi...
Bulma基于Flexbox布局技术开源现代CSS框架
Bulma是一个基于Flexbox布局技术的免费、开源的现代CSS框架，它提供了易于使用的前端的组件，您可以轻松地组合这些组件来构建响应式Web界面。官方网址：https://bulma.bootcss.com/源码下载地址：https://github.com/jgthms/bulma/releases/downlo...
css伪类nth-child()怎么用
在CSS3中nth-child()伪类对于在HTML中创建格式化的Excel样式表非常有用。也用于生成网格布局而不必求助于表格。 首先我们来了解一下nth-child()伪类的相关知识。 nth-child()伪类的基本规则： 我们使用的语法是：nth-child（an+b）其中a是频率，b是初始偏移量。这生成...
css中有什么伪类
css伪类有：“:link”、“:visited”、“:hover”、“:active”、“:focus”、“:lang()”、“not()”、&ldq...
ul li 横向排列不换行的做法
有些时候需要使用ulli水平排列而不要换行，做法很简单，直接拷我的代码上来，注意红色部分就可以了：#canvaslist{list-style:none;overflow:auto;margin:0;padding:0;border:1pxsolidred;zoom:1;white-space:nowrap;width...
div字体加粗
字体加粗font-weight属性设置文本的粗细。使用bold关键字可以将文本设置为粗体。关键字100~900为字体指定了9级加粗度。如果一个字体内置了这些加粗级别，那么这些数字就直接映射到预定义的级别，100对应最细的字体变形，900对应最粗的字体变形。数字400等价于normal，而700等价于bold。如果将元素...
纯css实现光标打字效果，纯CSS打字动效
效果如下：创建html页面，在body中添加以下html代码：<pclass="load-text">loading...</p>css代码：/*光标动画*/@keyframescaret{50%{border-color:transparent;}}/*文本动画：从宽度为0开始*/@keyfr...
css中border-radius
<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><tit...
CSS rotate3d()实例讲解
rotation3d()函数是一个内置函数，用于在3D空间中围绕固定轴旋转元素。用法:rotate3d(x,y,z,angle)参数：该函数接受上述和以下所述的四个参数： x:它包含一个表示x坐标的数字。取值范围是0〜1。y:它包含一个表示y坐标的数字。取值范围是0〜1。z:它包含一个表示z坐标的数字。取值范...
CSS3 transition过渡属性
<ahref="http://www.51dev.com">www.51dev.com</a><!DOCTYPEhtml><html><head><style>div{width:100px;height:100px;background:yell...
css list style type属性怎么用
csslist-style-type属性用于设置列表项标记的类型，可以通过不同的属性值设置不同的列表项标记。所有浏览器都支持list-style-type属性。 csslist-style-type属性怎么用？list-style-type属性设置列表项标记的类型。可设置的属性值：● none：无...
css标准导航代码
1<!--例子解析：-->-->23<!--list-style-type:none-移除列表前小标志。一个导航栏并不需要列表标记-->4<!--移除浏览器的默认设置将边距和填充设置为0-->5<!--上面的例子中的代码是垂直和水平导航栏使用的标准代码。-->6&l...
