CSS_第9页_IT分享知识网

CSS

改变鼠标样式图片css[亲测有效]

改变鼠标样式图片css[亲测有效]你需要一张图 .ico的格式如果一开始你要解决的是怎么去用png格式图片转成ICO格式先做一张32*32的PNG格式图片然后打开http://www.easyicon.net/covert/ 网站转成ICO格式然后就是CSS了放图片到你网站上记住引用的路径要对打开F12去看看路径对不对*{cursor:url

2023-07-26

256

CSS

CSS入门学习笔记+案例[亲测有效]CSS入门学习一、CSS简介1、什么是CSSCSS：CascadingStyleSheet层叠样式表是一组样式设置的规则，用于控制页面的外观样式2、为什么使用CSS实现内容与样式的分离，便于团队开发样式复用，便于网站的后期维护页面的精确控制，让页面更精美3、CSS作用页面外观美化布局和定位二、基本用法1、CSS语法<head> <style> 选择器{ 属性名：属性值; 属性名：属性值; } </style>&l

2023-07-23

169

CSS

CSS伪类实现圆弧「终于解决」

CSS伪类实现圆弧「终于解决」CSS伪类实现平滑圆弧在移动端布局时，经常会见到边框圆弧效果，见如下效果图：为了达到更好的效果，经常会用伪类实现HTML结构：<divclass=”box”></div>CSS样式：.box{position:relative;width:300px;height:100px;z…

2023-07-21

170

CSS

CSS+JavaScript 相册特效「终于解决」

CSS+JavaScript 相册特效「终于解决」嗯就是这样一个例子，视频学到的一个特效，实际用处并不大，但是可以帮助理解JS语言和熟悉CSS3样式。设计：　观察一张图片的变化，发现：1、图片缩放（随机，并且不是同时运动）　　1、从大到小　　2、从小到大，透明度从1到0（在第一步运动完成后立马开始）2、图片旋转（随机，并且不是同时运动的。需要在全部运动走完以后开始）3.因为每张图片是随机开始变换的，所以起始时间是…

2023-07-19

194

CSS

css 布局的几种方式[通俗易懂]

css 布局的几种方式[通俗易懂]前言1table布局2flex布局2.1盒模型2.2display/poistion2.3flexbox布局3float布局前言CSS的布局应该是CSS体系中的重中之重了，主要的布局方式有table表格布局（早期），float浮动布局和flex布局，还有针对于移动端的响应式布局，不论是工作还是面试都是非常重要的知识…

2023-07-18

224

CSS

CSS布局—— float布局和flex布局「建议收藏」

CSS布局—— float布局和flex布局「建议收藏」float布局和flex布局

2023-07-13

186

CSS

css中clearfix的用法（清除浮动）[通俗易懂]

css中clearfix的用法（清除浮动）[通俗易懂]在某些元素中定义了float属性，而导致父级div无法显示高度（不占据空间的问题），需要clearfix属性来包裹，即清除浮动元素脱离文档流。

2023-07-11

159

CSS

css的父选择器[亲测有效]

css的父选择器[亲测有效]css的父选择器首先声明一点，目前没有css的父选择器。新出的css3也没有。但是已经有很多人有很多次提案了。反向选择在2008年ShaunInman建议这种父选择器。a<img{border:none;}这段css的目的是选择img元素的a标签。parentRemySharp建议使用:parentaimg:parent{background:…

2023-07-02

197

CSS

CSS选择器优先级[亲测有效]

CSS选择器优先级[亲测有效]CSS选择器优先级（1）CSS选择器都有权重值，权重值越大优先级越高。内联样式表的权重值最高，值为1000。id选择器的权重值为100。class选择器的权值为10。类型（元素）选择器的优先级为1。通配符选择器的优先级为0。（2）当权值相等时，后定义的样式表要优于先定义的样式表。（3）在同一组属性设置中表有**“!important”**规则的优先级最大。后代选择器CSS后代选择器指为某标签元素内的特定后代标签元素来定义其样式。在CSS后代选择器中，规则左边的选择器一端包含两个或多个

2023-05-21

155

CSS

CSS3选择器大全「终于解决」

CSS3选择器大全「终于解决」1.CSS3选择器属性选择器在HTML中，通过各种各样的属性可以给元素增加很多附加的信息。例如，通过id属性可以将不同div元素进行区分。input[type="text"]{width:150px;display:block;margin-bottom:10px;background-color:yellow;font-family:Verdana…

2023-05-20

193

CSS

CSS3选择器介绍及用法总结「建议收藏」

CSS3选择器介绍及用法总结「建议收藏」CSS3新增了很多强大的选择器它可以让我们少写一些js事件脚本我们先来看看各个版本的选择器有哪些注：ele代表element元素attr代表attribute属性，val代表value属性值:xxx都属于伪类选择器，::xxx都属于伪元素选择器有名字的选择器我尽量细分了CCS1选择器选择器类型示例说明.class类选择器.demo

2023-05-18

162

CSS

css下拉菜单样式_CSS样式下拉菜单「建议收藏」

css下拉菜单样式_CSS样式下拉菜单「建议收藏」css下拉菜单样式Introduction:介绍：Asweallknowthatthestylingwebsiteorwebpagesareanimportantaspectofwebdevelopment.Onemustpututmostattentiontothestylingoftheirwebpagesorwebsite…

2023-05-16

172

CSS

js+css改造jsmind实现思维导图 | 树状图[通俗易懂]

js+css改造jsmind实现思维导图 | 树状图[通俗易懂]一.调研树状图|思维导图调研1．https://juejin.cn/post/68449041032989900932.echartshttps://echarts.apache.org/examples/zh/editor.html?c=tree-polyline3.https://juejin.cn/post/68449036154259374164.https://bl.ocks.org/mbostock/43390835.https://fperucic.github.io/tr

2023-05-04

717

CSS

【CSS布局】Flex布局中元素换行设置间距问题[通俗易懂]

【CSS布局】Flex布局中元素换行设置间距问题[通俗易懂]flex布局解决换行问1.父元素定高的情况下，直接使用align-content:space-between;ul{list-style:none;display:flex;height:614px;flex-direction:row;flex-wrap:wrap;justify-content:space-bet.

2023-05-03

163

CSS

CSS绝对定位absolute详解[通俗易懂]

CSS绝对定位absolute详解[通俗易懂]之前介绍过CSS浮动float详解，本篇介绍的绝对定位absolute和浮动float有部分相似性。如果能理解浮动float，对理解绝对定位absolute会大有帮助。先说absolute和float的相似处：包裹性和高度欺骗包裹性所谓一图胜千言（唯一的区别是：下图的div增加了absolute）<divstyle=”border:4pxsolidblu…

2023-04-27

260

CSS

纯HTML+CSS网页设计期末作业（个人网站）[亲测有效]

纯HTML+CSS网页设计期末作业（个人网站）[亲测有效]目录纯HTML+CSS网页设计期末作业（个人网站）效果展示源码index.htmlindex.cssabout.htmlhobbies.htmlhobbies.cssme.htmlme.cssbook1.htmlbook.csssongci.htmlsongci.css缺陷纯HTML+CSS网页设计期末作业（个人网站）效果展示index页面about页面hobbies页面书籍介绍页面元曲介绍页面源码index.html<!DOCTYPEhtml><h

2023-04-25

476

CSS

CSS学习20：absolute（绝对定位）「建议收藏」

CSS学习20：absolute（绝对定位）「建议收藏」绝对定位的介绍：绝对定位是元素在移动位置的时候，是相对于它祖先元素来说的（拼爹型）。语法：选择器{position:absolute;}1、完全脱标——完全不占位置；2、父元素没有定位，则以浏览器为准定位（Document文档）。3、父元素要有定位i.元素将依据最近的已经定位（绝对、固定或相对定位）的父元素（祖先）进行定位。ii.绝对定位的特点总结：（务必记住）…

2023-04-25

173

CSS

css滑动门技术「终于解决」

css滑动门技术「终于解决」css滑动门技术为了使各种特殊形状的背景能够自适应元素中文本内容的多少，出现了css滑动门技术。使各种特殊形状的背景能够自由拉伸滑动，以适应元素内部的文本内容，可用性更强。最常见于各种导航栏的滑动门。工作原理滑动门技术的关键主要在于图片拼接，利用CSS精灵Sprite（主要是背景位置position）和盒子padding撑开宽度,以便能适应不同字数的导航栏。原背景图–>切开…

2023-04-23

232

CSS

CSS 中相对定位(relative)与绝对定位(absolute)的详解「终于解决」

CSS 中相对定位(relative)与绝对定位(absolute)的详解「终于解决」position:relative相对定位详解相对定位是元素在移动位置的时候，是相对于它原来的位置来说的。相对定位的特点：它是相对于自己原来的位置来移动的(移动位置的时候参考点是自己原来的位置)原来在标准流的位置继续占有，后面的盒子仍然以标准流的方对待它(不脱标，继续保留原来的位置)。因此相对定位并没有脱标，它最典型的应用是给绝对定位当爹的。position:absolute相对定位详解绝对定位是元素在移动位置的时候，是相对于它的祖先元素来说的（拼爹型）。绝对定位的特点：如果没有祖