首页
关于
归档
朋友
留言
API平台
告白墙
休闲游戏
更多
留言板
练字贴
Layui手册
Search
1
【PHP】PHPoffice/PHPSpreadsheet读取和写入Excel
1,006 阅读
2
【Git】No tracked branch configured for branch master or the branch doesn't exist.
742 阅读
3
【composer】composer常用命令
487 阅读
4
【Layui】控制页面元素展示隐藏
437 阅读
5
【MySQL】MySQL触发器应用场景和使用方法
417 阅读
默认分类
PHP
ThinkPHP
Laravel
面向对象
设计模式
算法
基础
网络安全
Web
HTML
CSS
JavaScript
jQuery
Layui
VUE
uni-app
Database
MySQL
Redis
RabbitMQ
Nginx
Git
Linux
Soft Ware
Windows
网赚
Go
登录
Search
标签搜索
PHP
函数
方法
类
MySQL
ThinkPHP
OOP
JavaScript
Layui
Web
Linux
Array
设计模式
Git
PHPSpreadsheet
PHPoffice
排序算法
面试题
Windows
基础
小破孩
累计撰写
212
篇文章
累计收到
16
条评论
首页
栏目
默认分类
PHP
ThinkPHP
Laravel
面向对象
设计模式
算法
基础
网络安全
Web
HTML
CSS
JavaScript
jQuery
Layui
VUE
uni-app
Database
MySQL
Redis
RabbitMQ
Nginx
Git
Linux
Soft Ware
Windows
网赚
Go
页面
关于
归档
朋友
留言
API平台
告白墙
休闲游戏
留言板
练字贴
Layui手册
搜索到
2
篇与
的结果
2022-06-23
【CSS】整个网站设置黑白背景 用于需求:悼念日
<style> html{ -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); filter: gray; } </style>
2022年06月23日
115 阅读
0 评论
0 点赞
2022-06-17
【Web】CSS常用内容及解释
CSS 选择器 基本选择器grif *通配符:匹配所有的html标记,所有吊机都会改变的 标签选择器:将其匹配指定的html标记 class选择器:给一类HTML标记加样式。这里所指的“一类”是:每个HTML标记都有一个class属性,且class的值一样。class属性是公共属性,每个HTML标记都有 id选择器:给指定id的元素添加样式。网页中HTML标记的id属性的值,必须是唯一的。 组合选择器 多元素选择器:给多个元素加同一个样式,多个选择器之间用“,”隔开 后代选择器 给某个标签的某个后代元素加样式,选择器之间用空格隔开 子元素选择器:给某个元素的子元素添加样式举例:div > h1.title{color:red;} css尺寸属性 width:元素宽度,一定要加px单位 height:元素高度 css字体属性 font-size:字体大小 font-family:字体 font-style:斜体,取值:italic font-weight:粗体,取值,bold css文本属性 color:文本颜色 text-decoration:文本修饰线,取值:none(无),underline(下划线),overline(上划线),line-through(删除线) text-align:文本水平对齐方式,取值:left,center,right line-height:行高,可以用固定值,也可以用百分比 text-indent:首行缩进 letter-spacing:字间距 CSS选择器——基本选择器(单个选择器) 1,通配符“*”:将匹配所有的HTML标记,只要<body>中存在的标记都会生效。 2,标签选择器:对应于HTML标记,有什么样的HTML标记,就有什么样的标签选择器。如:p{color:red;} 3,类选择器:给HTML标记中,class属性值相同的元素,添加样式。命名必须以“.”开头。如:.news{} 4,Id选择器:给HTML标记中,具有id属性的元素,添加样式。唯一性。命名以“#”开头。如:#news{} CSS选择器——组合选择器(多个选择器) 1,多元素选择器:同时给多个元素添加样式,各个选择之间用逗号“,”分开。如:p,h1,#box{} 2,后代元素选择器:给某个元素的所有后代元素,添加样式。用空格隔开。如:#box h1{} 3,子元素选择器:给某个元素的子元素添加样式。用“>”隔开。如:#box > h1{} 一个超链接,有四个状态: 正常状态(:link):鼠标没放上之前链接的样式。 放上状态(:hover):鼠标放到链接上时的样式。 激活状态(:active):按住鼠标左键不松开的样式,这个状态特殊短暂。 访问过的状态(:visited):按下鼠标左键,并弹起,这时的样式效果。 在平常工作中,会使用以下写法,来给链接加不同的样式: a:link, a:visited{ color:#444; text-decoration:none; } //将“正常状态”和“访问过的状态”合二为一。 a:hover{ color:#990000; text-decoration:underline; } //“鼠标放上”单做一种效果 list-style:列表样式,取值:none。去掉项目符号或者编号前面的各种符号 ul li{list-style:none;/*去除前面的符号*/} css边框属性 border-left:左边框线 格式:border-left:粗细 线型 线的颜色 线型:none(无线) solid(实线) dashed(虚线) dotted(点状线) 举例:border-left:5px dashed red; border-right:有边框 border-top:上边框 border-bottom:下边框 /*行内元素没有width和height属性 块级元素才有width和height的属性 */ css内边距属性 padding-left:左内填充距离,左边先到内容间的距离 padding-right:右内填充距离,右边线到内容间的距离 padding-top:上内填充距离,上边线到内容间的距离 padding-bottom:下内填充距离,下边线到内容间的距离 缩写形式 padding:10px;//四个边的内填充分别为10px padding:10px 20px;//上下为10px,左右为20px padding:5px 10px 20px;//上为5px,左右为10px,下为20px padding:5px 10px 15px 20px; //循序是:上右下左(顺时针) css外边距属性 margin-left:左边线往外的距离 margin-right:右边线往外的距离 margin-top:上边线往外的距离 margin-bottom;下边线往外的距离 简写形式 margin:10px;//四个外边距分别为10px margin:10px 20px;//上下外边距10px,左右外边距20px margin:5px 10px 15px;//上外边距5px,左右外边距10px,下外边距15px margin:5px 10px 15px 20px;//上右下左(顺时针方向) css背景属性 background-color:背景颜色 background-image:背景图片 例:background-image:url(路径) background-repeat:背景平铺方式。取值no-repeat(不平铺),repeat-x(水平方向),repeat-y(垂直方向) background-position:背景定位,格式:background-position:水平方向定位,垂直方向定位 英文单词定位:background-position:left|center|right top|center|bottom; 用固定值定位:background-position:50px 50px;//背景距离容器的左边50px,容器的顶端50px 用百分比定位:background-position:50% 50%;//水平居中,垂直居中 用混合定位:background-position:left 10px;//背景靠左边齐,距离容器顶端10px 简写方式: background:背景色 背景图 平铺方式 定位方式 举例:background:url(images/bg.gif) no-repeat center center; 举例:background: #ccc url(images/bg.gif) no-repeat left 10px; css浮动和清除 float:让元素浮动,取值:left(左浮动),right(右浮动) clear:清除浮动,取值:left(清除左浮动),right(清除右浮动),both(同时清除上面的左右浮动) 1、CSS浮动 浮动的元素,将向左或向右浮动,浮动到包围元素的边上,或上一个浮动元素的边上为止。 浮动的元素,不再占空间了,并且,浮动元素的层级要高于普通元素。 浮动的元素,一定是“块元素”。不管它原来是什么元素。 如果浮动的元素,没有指定宽度的话,浮动后它将尽可能的变窄。因此,浮动元素一般要定宽和高。 一行的多个元素,要浮动一起浮动 2、CSS清除浮动 CSS清除浮动的功能有两个:(1)可以包围元素从“视觉上”包住浮动元素(2)清除之下的其它元素将恢复默认排版。 有浮动,就得有清除。 如果包围元素指定了高度了,那么可以不使用清除功能。 css优先级 行内样式》id选择器》class选择器》标签选择器 display属性 功能:规则网页元素如何显示的问题 取值:none(隐藏),block(一块级元素显示),inline(以行内元素显示) block:可以实现将行内元素转换成块级元素 inline:可以实现将块级元素转换成行内元素 overflow属性:当内容溢出时,该如何显示 取值:visible(可见),hidden(隐藏),scroll(出现滚动条),auto(自动) cursor光标类型 取值:text(文本),help(帮助),wait(等待),pointer(手型)等。 css定位 position:元素定位方式 static:静态定位(默认状态,不定位); fixed:固定位置 relative:相对定位 absolute:绝对定位 定位方式要与定位属性配合使用 定位坐标:指定定位的元素,偏移目标元素多远的距离 left:定位元素,距离目标元素左边的距离 top:定位元素,距离目标元素上边的距离 right:定位元素,距离目标元素右边的距离 bottom:定位元素,距离目标元素下边的距离 css表格属性 border-collapse:表格边框线合并,取值:collapse 全局css设置 1、清除所有的标记的内外边距 body,ul,li,a,img,p,input{ margin:0; padding:0; } 2、去除项目符号或编号前面的符号 ul,ol,li{ list-style:none; } 3、全局链接效果 a:link , a:visited{color:#444;text-decoration:none;} a:hover{color:red;} 4、网页中所有的文字大小颜色 body{ font-size:12px; font-family:宋体; color:#ccc; } 5、去除图片的链接边框线 img{border:0;} 6、全局的类样式 .floatL{ float:left; } .floatR{ float:right; } .clear{clear:both;} .blank10{ height:10px; clear:both; } .red{ color:red; } .blue{ color:blue; }
2022年06月17日
138 阅读
0 评论
0 点赞