随笔分类 -  HTML/CSS

上一页 1 2
转载 | 防止页面图片过大出现横滚动条问题
摘要：- JS方法 - 就是一小段JS加到页面中就可以，下面把这段代码贴出来： - CSS方法 - 一、防止图片撑破DIV方法一 原始处理方法是将要展示的图片进行处理。比如你的DIV宽度为500px（像素），那你上传的图片或放入网页的图片宽度就要小于500px，也就是你图片需要图片软件剪切、等比例缩小方法 阅读全文
posted @ 2017-08-18 09:42 自转不息 阅读(1607) 评论(0) 推荐(0)
转载 | CSS实现单行、多行文本溢出显示省略号（…）
摘要：本文引自：https://www.cnblogs.com/wyaocn/p/5830364.html 首先，要知道css的三条属性。 overflow:hidden; //超出的文本隐藏 text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; / 阅读全文
posted @ 2017-08-16 15:56 自转不息 阅读(251) 评论(0) 推荐(0)
css常用代码块
摘要：顶部固定导航栏 | css 内边距累加消除 | css 阅读全文
posted @ 2017-08-01 20:26 自转不息 阅读(576) 评论(0) 推荐(0)
转载 | float 清除浮动的7种方法
摘要：什么叫浮动：浮动会使当前标签脱离文档流，产生上浮的效果，同时还会影响周边元素（前后标签）及父级元素的位置和width，height属性。下面用一个小例子来看一看浮动的全过程：1.首先我们新建一个网页，在网页中用div元素创建三个小的正方形，为了区别分别给他们不同的ID值和背景颜色，代码如下 为了方便 阅读全文
posted @ 2017-08-01 09:51 自转不息 阅读(336) 评论(0) 推荐(0)
转载 | CSS图片下面产生间隙的 6种解决方案
摘要：在进行页面的DIV+CSS排版时，遇到IE6（当然有时Firefox下也会偶遇）浏览器中的图片元素img下出现多余空白的问题绝对是常见的对於 该问题的解决方法也是「见机行事」，根据原因的不同要用不同的解决方法，这里把解决直接把解决image图片布局下边的多余空隙的BUG的常用方法归纳， 供大家参考。 阅读全文
posted @ 2017-07-31 09:53 自转不息 阅读(266) 评论(0) 推荐(0)
（转载）内联元素设置宽高问题
摘要：block元素的特点： 总是在新行上开始；此元素将显示为块级元素，此元素前后会带有换行符。高度，行高以及顶和底边距都可控制；宽度缺省是它的容器的100%，除非设定一个宽度。 可以控制宽高。 <div>, <p>, <h1>, <form>, <ul> 和 <li>是块元素的例子。 inline元素的 阅读全文
posted @ 2017-07-19 14:09 自转不息 阅读(3053) 评论(0) 推荐(0)
HTML/CSS：display:flex 布局教程
摘要：网页布局（layout）是 CSS 的一个重点应用。 布局的传统解决方案，基于盒状模型，依赖 display 属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。 2009年，W3C 提出了一种新的方案 Flex 布局，可以简便、完整、响应式 阅读全文
posted @ 2017-06-20 16:43 自转不息 阅读(1351) 评论(0) 推荐(0)
HTML/CSS：block，inline和inline-block概念和区别
摘要：总体概念 常见的块级元素有 DIV, FORM, TABLE, P, PRE, H1~H6, DL, OL, UL 等。 常见的内联元素有 SPAN, A, STRONG, EM, LABEL, INPUT, SELECT, TEXTAREA, IMG, BR 等。 block，inline和inl 阅读全文
posted @ 2017-06-15 17:23 自转不息 阅读(1116) 评论(0) 推荐(0)
HTML/CSS：导航栏水平和垂直
摘要：1.垂直导航栏 导航栏 = 链接列表导航栏基本上是一个链接列表，因此使用 <ul> 和 <li> 元素是非常合适的。如需构建垂直导航栏，我们只需要定义 <a> 元素的样式 演示： 代码： HTML CSS .nav {background-color: #F5F5DC;} .nav ul {marg 阅读全文
posted @ 2017-06-15 16:03 自转不息 阅读(24080) 评论(0) 推荐(0)
HTML/CSS：div水平与元素垂直居中（2）
摘要：单个div水平居中：设置margin的左右边距为自动 div水平和垂直居中，text-align和vertical-align不起作用，因为标签div没有这两个属性，所以再css中设置这两个值不能居中的效果 代码： HTML CSS 多个div水平居中：设置display的属性为inline-blo 阅读全文
posted @ 2017-06-14 22:33 自转不息 阅读(672) 评论(0) 推荐(0)
HTML/CSS：div居中和div内部元素垂直居中（1）
摘要：div居中 div水平和垂直居中，text-align和vertical-align不起作用，因为标签div没有这两个属性，所以再css中设置这两个值不能居中的效果 1. div水平居中:设置margin的左右边距为自动 6种元素垂直居中的方法 利用CSS进行元素的水平居中，比较简单，行级元素设置其 阅读全文
posted @ 2017-06-14 16:09 自转不息 阅读(7746) 评论(0) 推荐(0)
HTML/CSS：图片居中(水平居中和垂直居中)
摘要：css图片居中(水平居中和垂直居中) css图片居中分css图片水平居中和垂直居中两种情况，有时候还需要图片同时水平垂直居中， 下面分几种居中情况分别介绍: css图片水平居中 1.利用margin: 0 auto实现图片水平居中 利用margin: 0 auto实现图片居中就是在图片上加上css样 阅读全文
posted @ 2017-06-14 11:48 自转不息 阅读(208435) 评论(0) 推荐(2)

上一页 1 2