随笔分类 - CSS
1
摘要：mg的src可以通过content改变鼠标hover时的图片路径 <img class="import_img create" src="@/assets/add_icon.png" alt=""/> .titleButton:hover .create{ content: url("../../a
阅读全文
摘要：实例 指定每个 p 元素匹配同类型中的倒数第 2 个同级兄弟元素背景色： p:nth-last-child(2) { background:#ff0000; }
阅读全文
摘要：在许多使用场景下，会有让列表内元素竖着排列，高度不够，纵向换行的需求。本文教你如何实现一个竖着的元素排列。 最终效果 实现效果 实现效果动图 实现方法 实现元素纵向排列主要靠 css 的 writing-mode 属性和 float 属性。 writing-mode 属性定义了文本水平或垂直排布以及
阅读全文
摘要：各位、先看下第一个实现效果 产品经理：这个不好看，换一个 我：好看，再说不好看我要拔刀了 实现代码 HTML <div class="test test-1"> <div class="scrollbar"></div> </div> CSS .test { width : 50px; height
阅读全文
摘要：这是设置阴影 /* 长 宽 模糊度 颜色*/box-shadow: 0 1px 6px #ccc; 取消的话直接设置为0就行了，不建议直接去mui.css里面删掉，如果改掉mui里面的样式全部的样式都会变这是取消阴影 /* 长 宽 模糊度 颜色*/box-shadow: 0 0px 0px #ccc
阅读全文
摘要：首先html head之间加入： <meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport"> 首先html
阅读全文
摘要：在我们日常的Java web前端开发的过程中呢，程序员们会遇到各种各样的要求，所以不每天学的东西感觉自己都退步了，都更不上时代的发展了。 每天应对各种需求，每天活在疑问中就是我们程序员的真是写照。但我们还是一样热爱生活，热爱Java，HTML ,JSP。 在昨天的文章中，我写了关于Javascrip
阅读全文
摘要：图片作为背景，并且是链接的写法。例如网站的logo图片。例如：土豆的logo图片 <a title="土豆网 tudou.com 每个人都是生活的导演" href="http://www.jb51.net">土豆网</a> a {display: block;width: 170px;height:
阅读全文
摘要：基础说明： 外阴影：box-shadow: X轴 Y轴 Rpx color; 属性说明（顺序依次对应）： 阴影的X轴(可以使用负值) 阴影的Y轴(可以使用负值) 阴影模糊值（大小） 阴影的颜色 内阴影：box-shadow: X轴 Y轴 Rpx color inset; 默认是外阴影 内阴影：ins
阅读全文
摘要：利用@media screen实现网页布局的自适应 优点:无需插件和手机主题,对移动设备友好,能够适应各种窗口大小。只需在CSS中添加@media screen属性,根据浏览器宽度判断并输出不同的长宽值 1280分辨率以上（大于1200px） 1100分辨率（大于960px，小于1199px） 88
阅读全文
摘要：如何让一个div里面的div垂直居中？ 如何让上面灰色有文字那个div和背景图标垂直居中，不管屏幕大小有好大，始终在垂直方向上的中间。上面有整个布局和样式表，谢谢高手指点 如何让上面灰色有文字那个div和背景图标垂直居中，不管屏幕大小有好大，始终在垂直方向上的中间。上面有整个布局和样式表，谢谢高手指
阅读全文
摘要：先给一个简单的示例HTML代码 [html] view plaincopy <body> <form id="form1" runat="server"> <div id="title"> <ul id="list" > <li>标题一</li> <li>标题二</li> <li>标题三</li>
阅读全文
摘要：outline是css3的一个属性，用的很少。 声明，这是个不能兼容的css属性，在ie6、ie7、遨游浏览器都不兼容。 outline控制的到底是什么呢？ 当聚焦a标签的时候，在a标签的区域周围会有一个虚线的框，这个框不同于border的是，它是不占有任何宽度的。当你取消焦点的时候，这个虚线框就会
阅读全文
摘要：css如何让<a>标签，根据输入的内容长度调整宽度，宽度自适应，那位大仙帮帮忙 5 样式 .ceshi{float:left; margin-left:13px; width:180px;} .ceshi.title{font-size:16px; margin:5px 0px; float:lef
阅读全文
摘要：table中设置两行间距方法：css代码实现[/html]
阅读全文
摘要：CSS样式定义的优先级顺序总结层叠优先级是:浏览器缺省 我是绿色，内部样式表优先于浏览器缺省我是红色，类选择器优先于内部样式表我是黄色，ID选择器优先于类选择器我是蓝色，类选择器优先于内部样式表我是青色，类派生选择器优先于类选择器我还是青色，类派生选择器优先于所有类选择器我是黄色，ID选择器优先于类...
阅读全文
摘要：span{word-break:normal;width:auto;display:block;white-space:pre-wrap;word-wrap:break-word;overflow:hidden;}white-space -- 通过HTML文档的源代码的排版方式控制页面显示文本的排版...
阅读全文
摘要：如何用CSS制作横向菜单 让ul li横向排列及圆点处理第一步：建立一个无序列表我们先建立一个无序列表，来建立菜单的结构。代码是：首页产品介绍服务介绍技术支持立刻购买联系我们效果是：首页产品介绍服务介绍技术支持立刻购买联系我们第二步：隐藏li的默认样式，去掉圆点因为看起来不是很好看，菜单通常都不需要...
阅读全文
摘要：adius，就是半径的意思。用这个属性可以很容易做出圆角效果，当然，也可以做出圆形效果。原理很简单，“正方形的内切圆的半径等于正方形边长的一半”。下面就做一个红色的圆。工具/原料Adobe Dreamweave 软件方法/步骤语法：border-radius：none| {1,4} [ / {1,4...
阅读全文
1
浙公网安备 33010602011771号