随笔分类 -  HTML+CSS

响应式布局设计
摘要：响应式布局当今很流行的一个设计理念。什么是响应式布局？我的理解是根据不同大小的屏幕显示不同的页面布局。响应式布局怎么设计?一种比较简单的方法就是利用CSS3的Media Query来实现。@media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面，@media 是非常有... 阅读全文
posted @ 2015-04-16 17:16 孤独的狂欢 阅读(230) 评论(0) 推荐(0)
CSS中position属性三大定位方式讲解
摘要：RelativeRelative的元素相对于它原本的位置来做定位，但在文档流中依然保持着原有的默认位置，即使它作了偏移，周围的元素也不会占领的它的位置。如果一个元素是相对定位（甚至它还做了偏移），它周围的元素在排版时参考的依然是那个元素原本的位置（指在没有偏移时的位置）。如果同时声明top和bott... 阅读全文
posted @ 2015-03-31 01:02 孤独的狂欢 阅读(1921) 评论(0) 推荐(0)
CSS position 属性 一定要有width
摘要：今天做一个页面头部（header）固定的效果，css设置position:fixed。因为头部宽度是自适应浏览器宽度，css只写了height没写width。结果header没显示出来。后来设置了width: 100%;才显示出来。 阅读全文
posted @ 2015-03-29 15:44 孤独的狂欢 阅读(588) 评论(0) 推荐(0)
【转】30个你不可不知的CSS选择器
摘要：一、五大基本选择符1. *（通配符）*通配符选择器，经常用于css reset（样式重置），清理标签的默认样式，但现在一般不提倡直接使用*了，主要是*会匹配所有标签，相当耗资源。*在css的优先级中是最低的。* {margin: 0; padding: 0;} 也可以用*来匹配某一元素下的所有子元素... 阅读全文
posted @ 2015-03-25 15:05 孤独的狂欢 阅读(173) 评论(0) 推荐(0)
HTML文档类型的作用，文档类型有多少种？
摘要：HTML文档类型的作用是用来告知 Web 浏览器页面使用了哪种 HTML 版本。制作符合标准的网页，第一件事情就是声明符合自己需要的DOCTYPE。应当在HTML文档的第一行用 声明该网页所采用的文档类型。DOCTYPE是document type(文档类型)的简写。说明： 声明不是一个 HTML ... 阅读全文
posted @ 2015-03-24 11:24 孤独的狂欢 阅读(673) 评论(0) 推荐(0)
【CSS技巧】关于<hr>的属性设置
摘要：的颜色设置如果不加border:0;的话，虽然颜色改变了，但是会显示一条黑色的边框。如果不加height:1px;的话，在chrome会显示不出来。也可以用下面的代码实现：对齐在chrome中默认是左对齐。在IE中默认是居中对齐，要想左对齐得用text-align:left。 阅读全文
posted @ 2014-10-17 01:27 孤独的狂欢 阅读(10957) 评论(0) 推荐(1)
【CSS技巧】列表横向排列的另一种方法
摘要：列表等默认是纵向排列。我们需要它横向排列时通常会用float来实现，但是使用了float也通常会引发一些排版问题。今天我学到了另一种方法：设定标签的display:inline，把设定为内联元素来实现横向排列的效果，不需要使用float。列表横向排列的另一种方法 Item1 Item2 ... 阅读全文
posted @ 2014-10-15 01:21 孤独的狂欢 阅读(23022) 评论(1) 推荐(0)
【CSS经典问题】图片下面有空隙的解决办法
摘要：DIV中插入图片的话就会出现图片的下面有大概3px的空隙。在DW中看不到，但是在浏览器浏览的时候看出问题了。有4个解决方法：（1） css 添加display:block;（2） css 添加vertical-align:top;（3） css 添加vertical-align:bottom;（4）... 阅读全文
posted @ 2014-10-12 15:06 孤独的狂欢 阅读(1443) 评论(0) 推荐(0)
【CSS经典问题】子元素浮动之后如何撑开父元素
摘要：按照CSS规范，浮动元素（float）后会被移出文档流，不会影响到块状盒子的布局而只会影响内联盒子（通常是文本）的排列，所以不会撑开父元素的高度。但是很多时候我们需要页面根据内容自动调整高度的。如何解决这个问题呢？有6个方法：（1）在浮动子元素后面添加（2）父元素CSS添加z-index:1; ov... 阅读全文
posted @ 2014-10-10 22:38 孤独的狂欢 阅读(2589) 评论(0) 推荐(0)