M1racle_l-CSDN博客

原创 css中的一些小的补充

1，如果文本与图片在同一行中，那么将来文字与图片的默认对齐方式是文字的基线对齐图片的底线。2，overflow 溢出取值： hidden：将超出容器的部分隐藏起来 scroll：给容器加滚动条 auto: 根据具体情况判断容器是否加上滚动条3,如果定位的盒子没有宽高那么宽高默认为0.4,如果给子盒子设置宽度为100%，那么子盒子宽度与父盒子一样宽

2017-04-08 20:39:13 214

原创网站小三角

html 这是一段文本 css div { position: relative; } span { position: absolute;/*将三角摆放到文本旁边用子绝父相*/ top: 6px; left: 100; display: inline-block; width: 0; height: 0; border

2017-04-08 20:34:39 249

原创滑动门

基础滑动门html 导航1 导航12 导航341 导航1444 导航444441 css div { float: left; } span { float: left; display: inline-block; width: 4px; he

2017-04-08 20:20:46 435

原创圣杯布局

css代码 .content { padding: 0 200px; height: 200px; min-width: 200px;/*三块最小宽度减去内边距 200+200+200-200*2*/ } .left { float: left; width: 200px; height: 200px; margin-left:

2017-04-08 18:48:38 249

原创淘宝商品块，鼠标移上去改变边框样式的写法

html代码 CSS代码 div { float: left; width: 200px; height: 400px; border: 10px solid #ccc; margin-right: -10px;/*防止边框并列而导致块的边框不一致，使每个块向左移动10px,盖住左侧块的边框*/ } div:hover

2017-04-08 18:13:19 955

原创一小段文本放置小图标的方法

一，子绝父相定位法.one { position: relative; } .one b { display: inline-block; width: 21px; height: 16px; position: absolute; top: 4px; left: 4px; background: url(imgs/one.gif);

2017-04-07 16:47:08 288

原创 CSS初次实战之梅兰整站自搭建流程

已初始化完毕。一, 网站头部分为通栏>版心部分>版心左侧部分，版心右侧部分头部部分css代码.banxin { width: 970px; margin: 0 auto;}.top { height: 26px; background: #F7F7F7; border-bottom: 1px solid #D8D8D8;}.center { height: 26

2017-04-06 23:49:26 495

原创清除浮动的作用

如果一个父盒子没有设置高度，且其子元素设置了浮动，那么由于子元素浮动脱离了标准流，则父盒子撑不起来高度。当父盒子下面还有一个盒子的时候，所以下面的盒子会上移占据父盒子的位置。这时候就要清楚浮动。一般使用伪元素：after ：before清除浮动在要清楚的浮动的元素的类名中加一个类名.clearfix:after { content: ""; height: 0;

2017-04-05 22:53:30 427

原创 CSS中的子绝父相是什么意思

如果要对一个子元素使用定位，那么应该是子元素是绝对定位，它的父元素为相对定位。让子元素以其父元素为标准来定位。如果不这么做，子元素就会相对body或浏览器定位产生不好的效果。

2017-04-05 22:46:28 13165

原创 CSS中的定位

一，静态定位position:static;position属性的默认值。所有标准流中的元素都是静态定位二，相对定位 position：relative;相对元素原来的位置进行平移，需要配合top right bottom left属性使用。相对定位之后的元素，还保留着定位之前的位置，还在标准流中。三，绝对定位position: absolute;使用的时候要配合上右下

2017-04-05 22:09:06 228

原创 css中元素的隐藏方式

元素的隐藏overflow：hidden；超出的部分裁剪掉。visibility：hidden；可以将元素隐藏，但是在页面上保留着原来的位置display：none；可以将元素隐藏并且在页面上不占据位置display：none；与display：block；是一对反义词

2017-04-05 22:05:14 419

m0_37890907的博客