![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
html+css
hu_Time
这个作者很懒,什么都没留下…
展开
-
重置页面样式
创建人:胡胜辉描述:重置一些html自带的一些样式,比如a标签的下划线,ul,li的小圆点等样式body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collaps...原创 2019-11-21 15:50:06 · 332 阅读 · 0 评论 -
改变input框placeholder字体
改变input框字体/*input框字体颜色*/input::-webkit-input-placeholder { /* WebKit browsers */ color:#fff;}input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #fff;}input::-moz-placeholder { /*...原创 2019-08-22 05:40:51 · 178 阅读 · 0 评论 -
表单属性
今天熟悉了一下如何美化表单的一些元素,以及清楚默认的表单属元素样式,记录一下美化表单元素1、focus聚焦样式input:focus{//对轮廓进行偏移outline-offset:0;}元素聚焦时的样式2、checked单选或多选框被选中的样式html:css:input:checked+label{ color:red;}常见用法1.重置表单元素样式in...原创 2019-09-17 18:29:35 · 276 阅读 · 0 评论 -
美化表单——单选按钮
作者:hu_time描述:自定义input单选按钮的样式例子中改变的是单选框的样式,多选框同理。改变属性即可html:<div> 请选择性别: <label class="radio-item"> <!-- 默认的按钮 --> <input name="gender" type="radio"...原创 2019-09-24 16:07:54 · 1405 阅读 · 0 评论 -
多余文本显示三个点
记录一下在工作中遇到的一个超出文本显示省略号的问题,之前用下面通用的三行代码,结果失效了,然后又找的方法实现了一下。这是我在移动端遇到的不兼容问题,反正用最后的补充方法解决了它。代码直接可以用的。一行:overflow: hidden; text-overflow: ellipsis; white-space: nowrap;两行:word-break: break-all; ...原创 2019-08-26 11:42:23 · 743 阅读 · 0 评论 -
图片廊
html: <div class="photo-box"> <div class="photo"> <img src="../images/index_list/7.png" alt=""> <span>图片1</span> ...原创 2019-10-22 09:31:13 · 200 阅读 · 0 评论 -
背景图固定内容超出可滑动
背景固定内容可滑动html``html, body, span, div, ul, li, header {padding: 0;margin: 0;}body,html{width: 100%;height: 100%;/background-color: #7f42bb;/}.main{width: 100%;height: 100%;background: ur...原创 2019-10-10 11:11:44 · 1028 阅读 · 1 评论 -
img标签设置了宽高但是src不给路径会出现边框
img标签设置了宽高但是src不给路径会出现边框img[src = “”]{opacity:0;}原创 2019-09-16 17:16:46 · 448 阅读 · 0 评论 -
多容器切换样式
需要引入jquery才能实现点击切换样式的效果html: <div class="nav-box"> <div id="content" class="tab-box"> <div class="tab tab1 "> <span>全部</span &...原创 2019-09-16 17:29:36 · 176 阅读 · 0 评论 -
tab栏切换
html: <div class="tab"> <span >全部</span > </div> <div class="tab"> <span>待付款</span> <...原创 2019-09-16 17:20:56 · 148 阅读 · 0 评论 -
当子容器内容超出父容器内容时子容器可以进行滚动
//横向在父类设置display: flex;overflow-x: auto;overflow-y: hidden;在子类设置flex-shrink: 0;//纵向css3新特性-webkit-scrollbar ,兼容性差点儿,简单overflow-x: hidden;overflow-y: scroll;//兼容性高,复杂/* 父容器设置宽度, 并超出部分不显示 /...原创 2019-09-16 17:14:49 · 3161 阅读 · 0 评论