![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Html&Css
一名写前端的GISer
这个作者很懒,什么都没留下…
展开
-
按钮组实现切换时背景变化
按钮组之间切换时,选中的按钮背景变色,其他按钮显示原来的颜色。原创 2024-05-06 17:20:15 · 170 阅读 · 0 评论 -
css实现背景是平行四边形
颜色渐变:原创 2024-02-27 10:49:44 · 245 阅读 · 0 评论 -
CSS3动画大全
css3动画转载 2023-01-06 17:11:40 · 321 阅读 · 1 评论 -
CSS中限制span显示字数
span{ display: block; width: 120px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}注意:width一定要有转载 2023-05-31 16:41:51 · 1188 阅读 · 1 评论 -
滚动条样式
转自:https://www.jianshu.com/p/c2addb233acd转载 2021-04-01 13:57:52 · 89 阅读 · 0 评论 -
竖向表格样式
竖向表格HTML<table class="mailTable" cellspacing="0" cellpadding="0"> <tr> <td class="column">订单编号</td> <td>12121212121212121</td> </tr> <tr> <.转载 2020-12-16 16:00:29 · 1252 阅读 · 0 评论 -
自定义表格样式
效果图:css:/*table---start*/ table { border-collapse: collapse; border-spacing: 0; border: 1px solid #c0c0c0; } th,td { border: 1px solid #d0d0d0; color: #404060;原创 2020-11-17 16:43:39 · 202 阅读 · 0 评论 -
div中溢出的文字省略显示
1.div中文字显示在一行,并将溢出的文字省略显示 <div style="width:100px;height:20px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;"> aaaaaaaaaa,bbbbbbbbbb,ccccccc </div> 这样查出div的文字就会以省略的形式显示,并不是单独的截取。 想要div以省略的形式显示的时候,只单独设...转载 2020-09-18 17:05:17 · 4577 阅读 · 0 评论 -
css引入字体库
@font-face { font-family: font;/*给引入字体起的名字*/ src:url('你的字体路径.woff'), url('你的字体路径.ttf'), url('你的字体路径.eot'); /* IE9 */}html,body{ font-family: font;}转自:https://blog.csdn.net/qq_41869574/article/details/103407490...转载 2020-09-14 10:16:29 · 861 阅读 · 0 评论 -
div中的div水平垂直居中
子绝父相,定位到大盒子的宽高一半的位置,再用transform: translate向左向上移动自己宽高的一半<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style&...转载 2020-03-13 15:54:52 · 139 阅读 · 0 评论 -
div背景图片完整填充样式设置---background、background-size、background-attachment
<div>图片</div><style>div{ background: url(images/images/bg.jpg) no-repeat; background-size: cover; background-attachment: fixed;}</style>说明:1、backgro...原创 2020-03-09 13:51:32 · 9575 阅读 · 0 评论 -
textarea去掉多余的空格
转自:https://blog.csdn.net/my_world_sky/article/details/78551351https://blog.csdn.net/anyaoqi/article/details/87467265转载 2020-03-05 10:15:10 · 434 阅读 · 0 评论 -
关于设置display:inline-block,两个div之间产生空隙的解决方法
借鉴相关文章:html - How to remove the space between inline-block elements?转自:https://blog.csdn.net/qq_33549229/article/details/52711496转载 2020-01-10 09:30:54 · 669 阅读 · 0 评论 -
CSS3 box-shadow 效果大全
转自:https://www.html.cn/archives/9360转载 2019-12-28 16:54:38 · 291 阅读 · 0 评论 -
css设置只显示图片的一部分
转自:https://blog.csdn.net/zhaoyingjiao/article/details/8983967转载 2019-12-19 10:59:31 · 1823 阅读 · 0 评论 -
css样式之导航条(nav)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css">原创 2018-09-03 23:52:31 · 16228 阅读 · 0 评论 -
CSS选择器之 :nth-child(n)
CSS3 :nth-child(n):转自:http://demo.doyoe.com/css3/nth-child(n)/转载 2018-09-04 18:53:51 · 119 阅读 · 0 评论 -
CSS选择器
本文中包含了CSS1、CSS2、CSS3选择器,并对其中的一些自认为较难理解的地方做了注记,希望对大家有用一、CSS1选择器 CSS1选择器注:注1:为什么要LVHA 1.鼠标经过的“未访问链接”同时拥有a:link、a:hover两种属性,后面的属性会覆盖前面的属性定义;2.鼠标经过的“已访问链接”同时拥有a:visited、a:hover两种属性,后面的属性会覆盖前面...原创 2018-09-05 08:50:35 · 4927 阅读 · 0 评论 -
设置两个DIV为display:inline-block出现上下错位问题
转自:https://www.cnblogs.com/jiangzilong/p/6145157.html转载 2018-10-30 14:49:17 · 2947 阅读 · 0 评论 -
div中的img垂直居中显示
转自:https://www.thinkcss.com/jiqiao/1492.shtml下面只列出了方法3,其他方法见上面的链接3、用绝对定位实现垂直居中(推荐-兼容性好)解释:1、一张包裹在div中的img图片,给图片以及div元素定义了尺寸。2、给img的父元素添加相对定位属性(position: relative),同时,要给子元素也就是图片img元素添加绝对定位属性(...转载 2018-11-24 14:11:17 · 2268 阅读 · 0 评论 -
span和img一行时如何垂直居中
转自:https://blog.csdn.net/tanqiaoxing/article/details/80167960转载 2019-07-30 14:40:18 · 712 阅读 · 0 评论 -
input输入密码时隐藏和显示的切换
html代码:<input type="password" class="secret"><span class="eyes"> <img class="secreteyes" src="/static/images/eyes.png" alt=""> //闭眼 <img class="secreteyesk none" src...转载 2019-08-20 09:33:59 · 953 阅读 · 0 评论 -
CSS滚动条样式
<style> /* 设置滚动条的样式 */ ::-webkit-scrollbar { width:8px;/*高宽分别对应横竖滚动条的尺寸*/ height: 8px; background-color: #edede6; } ...转载 2019-09-18 13:37:56 · 110 阅读 · 0 评论 -
块元素、行内元素
块级元素:div,p,form,ul,li,ol,dl,form,address,fieldset,hr,menu,table行内元素:span,strong,em,br,img,input,label,select,textarea,cite, ul - 无序列表ol - 有序表单dl - 定义列表...原创 2018-09-04 18:02:22 · 149 阅读 · 0 评论