weixin_44932552的博客

原创 keshihua

原创 js的helloword

原创 选择器规范和行高

1.选择器和{之间有空格，标签和：之间没有空格，但是标签和属性值之间有空格。2.并集选择器竖着写：3.选择器的嵌套层数应不超过3层，位置靠后的限定条件应尽可能精确。例如.nav a p(要保证不能和不想选的内容冲突，但是尽量不要超过3层)行高基线就是最短的一条线行间距：行高：通过设置文字的行高等于盒子的高度，可以让文本在盒子种垂直居中对齐解释：当不设置行高的时候，...

原创 行内元素和块元素的区别

注意：1.只有文字才组成的段落，例如p标签，h1,h2,h3,h4,h5,h6，属于文字类块级元素，里面不能放其他块级元素。2.链接里面不能再放链接。3.行内元素内部只能放文本和行内元素，但是a标签里面可以放块元素。行内元素：1.和相邻行内元素在一行上。2.高，宽无效，但水平方向的padding和margin可以设置，垂直方向无效。3.默认宽度就是它本身内容的宽度。4.行内元素内部...

原创 导航内示例

text-align就是让块元素里面的文字内容（内联元素和行内元素也可以当作文字）居中对齐。

原创 链接伪类选择器

伪类选择器：向某些选择器选择特殊的效果类选择器以.开头伪类选择器以：开头顺序不能颠倒：lv hao(lv的包，好 )实际的开发种只用到的hover：浏览器通过历史记录来判断一个链接是否被访问过；由于涉及到隐私问题，所以使用visited伪类只能设置字体颜色；hover和active也可以为其他元素设置，ie6不支持对超链接之外的元素使用hover和active。文本框获取...

原创 通栏写法及分布型示例

通栏中心的部分形式上和版心一样宽，只是背景颜色不显示就好了。

原创 版心

原创 浮动补充

浮动会脱离文档流，不占文档流的位置，会影响其他（后面的/下面的）文档流的位置，浮动只有左右浮动。1.浮动的元素不会超过内边距，不会贴着边框。2.一行显示：3.设置浮动后会使元素显示有行内块元素的特性。块元素设置浮动后贬称行内块元素，行内块元素浮动后变成块元素。父元素一定是文档流，块元素，独占一行。...

原创 浮动

如果想把三个div元素按行排列（块元素默认在文档流中自上向下排列）：1.可以设置display:inline-block.2.只是在文档流中自上而下排列，如果希望元素在页面中水平排列，可以使元素脱离文档流，使用float使元素浮动，从而脱离文档流。float:当为一个元素设置浮动以后，元素会立即完全脱离文档流，空出它之前在文档流的位置，元素脱离文档流后，它下边的元素会立即向上移动，元...

原创 文档流

文档流：文档流处在网页的最底层，它表示的是一个页面中的位置，我们所创建的元素默认都处在文档流中。就像块元素在文档流中默认宽度是父元素的100%，设置内边距时不会影响可见框的大小。...

原创 overflow

1.子元素默认是存在于父元素的内容区中，理论上子元素的大小最大可以等于父元素内容区的大小，如果子元素的大小超过了父元素的内容区，超出的部分会在父元素意外的位置显示。超出父元素的内容，称为溢出的内容。父元素默认的是将溢出的内容在父元素外面显示。2.overflow:可选值：–visible(默认值，不会对溢出内容做处理，元素会在父元素以外的位置显示)–hidden溢出的内容会被修剪，不会被显...

原创 display和visbility

1.display:如果我们单独设置链接的宽和高是不会起作用的，因为内联元素的盒子属性的宽和高不起作用，所以先将其变成块。因为块元素独占一行，显示效果如下图所示。hello被独占一行。若设置为inline-block，行内块元素，既具有块元素的特点，可以设置宽和高，又不会独占一行。none不显示某元素（在上例中就是a元素），并且位置也释放出来了。2.visbility:和...

原创 内联元素的盒子

原创 浏览器的默认样式

使用通配选择器*{}，主要清除margin和padding.

原创 垂直外边距的重叠解决方法

1.垂直外边距的重叠（兄弟元素之间）：在网页中相邻垂直方向的外边距会发生外边距的重叠。兄弟元素之间的相邻****垂直方向外边距取最大值而不是取和。当使用标签a将两区域隔开，使其不相邻。2.父子元素的垂直外边距相邻了，那么子元素的垂直外边距会设置给父元素。例如想给子元素设置一个上外边距，却发现子元素和父元素一起向下移动。解决方法一类：1.使用a将box1和box2隔开，那么俩...

原创 外边距

1.外边距指的是当前盒子与其他盒子之间的距离，它不会影响可见框的大小，但是会影响到盒子的位置，盒子也有4个方向的外边距。margin-xxx(top/bottom/left/right)2.eg.margin-top指的是盒子的上外边距，盒子的上边距和其他盒子的距离。由于页面中的元素都是靠左靠上摆放的，当我们设置上和左外边距时，会导致盒子自身的位置发生改变，如果设置右和下外边距会改变其他盒子...

原创 内边距

内边距（padding）指的是盒子的内容与盒子边框之间的距离，一共有4个方向的内边距。padding-xxx(top/bottom/left/right)加了内边距之后：可见内边距会影响盒子的可见框的大小，内容区的背景会延伸到内边距。因为 内容区可以放内容，而内边距不能，通过放元素可以间接看出其分界线，但是不明显。可通过该方式，因为子元素只包含在盒子的内容区。如图4个方...

原创 盒子边框设置的简写样式

1.盒子边框的属性三个不是缺一不可，浏览器会默认其他未写的值。大部分浏览器边框的宽度和颜色有默认值，而边框的样式默认值是none。2.边框的简写样式，通过它可以同时设置4个边框的样式，宽度，颜色，而且没有顺序要求。注意：border：是同时指定4个边框，不能同时指定。但是提供了border-xxx(top/right/bottom/left)可以同时设置4个边框中的一个边。如下例所示，两...

原创 盒子模型

1.2.盒子的结构从左往右依次为外边距(margin)，内边距(padding)，边框(border)，内容区（content）元素框的最内部分是实际的内容，直接包围内容的是内边距。内边距呈现了元素的背景。内边距的边缘是边框。边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素。3.在 CSS 中，width 和 height 指的是内容区域的宽度和高度。增加内边距、边框和外...

原创 文本样式

1.text-transform:2.text-decoration:例如：超链接默认的text-decoratin的样式是下划线,所以修改其属性为none就可以删除其下划线。2.letter-spacing:letter-spacing 属性增加或减少字符间（对字母和中文都有效）的空白（字符间距）。letter-spacing控制的是字间距，每一个中文文字作为一个“字”，而每一个...

原创 css介绍及样式结构

css介绍及样式结构1.网页不是平面的，我们看到的只是层次最高的。2.css的内联样式：3.内部样式表（将css样式写在head的style标签中，只对当前页面起作用）4.外部样式表：link标签也在head标签内部，style.css文件里存放的是设置样式的内容...

原创 详讲行间距

1.在CSS并没有提供一个直接设置行间距的方式，所以通过设置行高来间接设置行间距，使用line-height来设置行高，行高指的是两条单行线之间的距离，也就是一行的高度，网页中的文字实际上是写在一个看不见的线中，而文字会默认在行高中居中垂直显示。而行间距指的是两行文本之间的高度，等于行高减去字体大小，所以行高越大行间距越大。2.行高line-height的语法：2.1 line-height...

原创 颜色单位

颜色单位1.在css种直接使用颜色的单词表示不同的颜色。2.通过RGB值表示不同的颜色，通过三种颜色的浓度表示不同的颜色，例如rgb(红色的浓度，绿色的浓度，蓝色的浓度)，对光源进行设置的最低值可以是 0，最高值是 255，可以借助一些截图工具显示某些颜色的rgb值。浓度也可以用0%-100%之间的数字，0%代表0，100%代表255。3.也可以用十六进制表示颜色，三组两位的16进制表示，...