position: absolute;   white-space: nowrap;

对于定位这个性质我原理上来说自己是明白的,但是在实践的过程中,总会出现各种稀奇古怪的情况,加relative或是absolute就可以解决,但是遇到这些情况总是不明白为什么!!!难道是脑容量太小的原因吗!!!=_=!!还是先记基础知识好了,因为里面还是有很多坑!!相对定位: 内联元素加相对定位也不支持宽高!! relative并不会使元素脱离正常文档流! 以上两点说明加上相对定位不影响元素本身的特性,内联元素和块元素依旧保持原来本身的特性!就是说原来是内联加上relative以后还是内联啦! 如

原创文章,转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]本文地址:http://www.zhangxinxu.com/wordpress/?p=1152 一.关于“鑫三无准则” “鑫三无准则”这个概念早在去年我写“关于Google圆角高光高宽自适应按钮及其拓展”一文时就已经提到了.这是自己在页面重构的经验中总结出来的一套约束自己CSS的准则,即“无宽度”.“无图片”和“无浮动”,目的是使CSS布局模块化以及增强可扩展性. 此准则是针对我个人的,可能没有

原始(未居中): .con{ width:200px; height:200px; background:#ccc; position:relative; } .abs{ width:40px; height:20px; background:steelblue; position:absolute; ; } <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta nam

这几天有空,整理了关于CSS浮动和定位的一些知识点,有什么欠缺的地方,欢迎大家批评指正. 一.文档流的概念指什么?有哪种方式可以让元素脱离文档流? 文档流,指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列.并最终窗体自上而下分成一行行,并在每行中按从左到右的顺序排放元素.脱离文档流即是元素打乱了这个排列,或是从排版中拿走. 让元素脱离文档流的方法有:浮动和定位. 二.有几种定位方式,分别是如何实现定位的,使用场景如何? CSS定位方式有四种:默认定位(static).相对定位(r

1. 常用的块属性标签及特征有哪些? 常用块标签:Div  h1~ h6  ol ul li  dl td dd  table tr th td  p  br  form 块标签特征:独占一行,换行显示,可以设置宽高,块可以套块和行 2. 常用的行内属性标签及特征有哪些? 行标签:span  a  img  var  em  strong  textarea select option  input 行标签特征:在行内显示,内容撑开宽高,不可以设置宽高(img ,input除外),    行只能

妙味课堂的课程讲得非常的清楚,受益匪浅.先把HTML和CSS基础课程部分视频的学习笔记记录如下: padding #PS基础 ##前端需要的PS技能 - PS技能(前端需要):切图.修图.测量 - PS工具: - 移动工具 - 矩形选框工具 - 裁切工具 - 吸管工具 - 横排文字工具 - 手抓(快捷键:空格) - 缩放(快捷键:Ctrl + 和 Ctrl -) - 标尺(快捷键:Ctrl R,主要是拖出参考线.矩形区域选择的时候,按住Ctrl,就能贴合参考线) - 自由变换(快捷键 Ctrl

html部分 html头部声明 DOCTYPE是document type(文档类型)的简写,用来说明你用的XHTML或者HTML是什么版本.DOCTYPE声明必须放在每一个XHTML文档最顶部,在所有代码和标识之上. <head>         <title>标签 title就是说这个网页是干什么的,公司名.产品名.功能名等等,全是给浏览器,以方便用户能快速准确得了解到这个网页要介绍的内容. title的特点: title标签只能在head标签内出现: 标签内的内容通常在浏览器

inline-block 特性: 1.块在一排显示 2.内联支持宽高 3.默认内容撑开宽度 4.标签之间的换行间隙被解析(问题)[相当字体大小的一半] 5.ie6 ie7不支持块属性标签的inline-block(问题)   float浮动: 1.块在一排显示 2.内联支持宽高 3.默认内容撑开宽度 4.脱离文档流 5.提升层级半层   position:relative;  相对定位 a.不影响元素本身的特性: b.不使元素脱离文档流: c.如果没有定位偏移量,对元素本身没有任何影响: 定位元

从接触CSS布局开始,就一直在听盒模型的概念了,网上的文章有很多,深浅不一.有些人会认为盒模型很简单,不就是border.margin.padding.content嘛,一个元素所占的空间就是把它们都加起来~仅仅如此吗?当然不是,盒模型的概念其实挺好理解,但难的是与其他属性一块使用时产生的现象.下面把我知道的一些特性梳理一下,这也是css中最基础的知识,面试常会问的东西. 盒模型的基本概念 正如上面说的,盒子模型的几个要素就是border.margin.padding.content,相信你已经

× 目录 [1]水平对齐+行高 [2]水平+垂直对齐 [3]margin+垂直对齐[4]absolute[5]flex 前面的话 水平居中和垂直居中已经单独介绍过,本文将介绍水平垂直同时居中的5种思路 思路一: text-align + line-height实现单行文本水平垂直居中 <style> .test{ text-align: center; line-height: 100px; } </style> <div class="test" sty

本文为大家分享CSS3定位和浮动的基础概念,与使用方法,供大家参考,具体内容如下 一.定位 1. css定位: 改变元素在页面上的位置 2. css定位机制: 普通流: 浮动: 绝对布局: 3. css定位的属性: position 把元素放在一个静态的,相对的,绝对的,或者固定的位置中 top/left/right/botom 元素向上/左/右/下的偏移量 overflow 设置元素溢出其区域发生的事情 clip 设置元素显示的形状 vertical-align 设置元素显示的对其方式 z-i

定位 position body<html<文档  定位是相对文档的 不是相对 body 或 html 1.position:relative 相对定位 a.不能使内嵌元素支持宽高  b.不改变文档流 2.position:absolute 绝对定位 a.使内嵌元素支持宽高 b.使元素完全脱离文档流 c.块属性标签 内容撑开宽度 d.有父级定位的 相对于父级  不是结构父级 e.相对定位都是配合绝对定位用的 定位元素 默认后者层级高于前者 z-index:[number]

position relative 设置区块基准点为左上角(相对定位 以区块的左上角为基准点 仍然会暂居原来的位置) a.不影响元素本身的特性: b.不使元素脱离文档流: c.如果没有定位偏移量,对元素本身没有任何影响: 定位元素位置控制 top/right/bottom/left 定位元素偏移量. absolute 设置网页的为基准点左上角(绝对定位 以网页的左上角为基准点 不会暂居原来的位置) a.使元素完全脱离文档流: b.使内嵌元素支持宽高: c.块属性标签内容撑开宽度(在没有设置宽的情

一.内联标签和块标签的区别 内联,内嵌,行内属性标签: 1.默认同行可以继续跟同类型标签: 2.内容撑开宽度 3.不支持宽高 4.不支持上下的margin和padding 5.代码换行被解析 块属性标签: 1.默认独占一行显示: 2.没有宽度时,默认撑满一排 3.支持所有css命令 二.display display:block; 显示为块display:inline; 显示为内嵌 display:inline-block特性:1.块在一行显示:2.行内属性标签支持宽高:3.没有宽度的时候内容撑

如何让图1中的div2移动到如图2上的位置: 思路:哪些css命令能够影响盒子显示的位置呢? relative相对定位/定位偏移量 position:relative;  相对定位         a.不影响元素本身的特性: b.不使元素脱离文档流: c.如果没有定位偏移量,对元素本身没有任何影响: 定位元素位置控制         top/right/bottom/left  定位元素偏移量. absolute绝对定位/定位层级 osition:absolute;  绝对定位 a.使元素完全脱

1.定位: position:relative(相对) 不影响元素本身的特性: 不使元素推理原来文档流:还占有所在的位子. 定位元素控制:top/right/bottom/left 定位元素偏移量. absolute(绝对定位) 使元素脱离文档流, 使内嵌元素支持宽高, 快属性标签内容撑开宽度. 相对于整个文档发生偏移,不是相对以自身原来位置或者body来偏移: *如果有定位父级,就相对于定位父级定位,如果没有,则相对于文档定位 相对定位一般情况下都是为配合绝对定位来使用的 定位元素默认后者的层

一.认识前端 前端开发的核心语言: html - 超文本标记语言 结构 css - 层叠样式表 样式 javascript - 脚本语言 行为 <html></html> 双标记 双标签 <meta/> 标记 单标签 css的语法就是 属性名:属性值; 第一个HTML文件 <html> <head> <meta charset="utf-8"> <title>我是头</title> <

前端书写规范: 1.所有书写均在英文半角状态下的小写: 2.id,class必须以字母开头: 3.所有标签必须闭合: 4.html标签用tab键缩进: 5.属性值必须带引号: 6.<!-- html注释 --> 7./* css注释 */ 8.ul,li/ol,li/dl,dt,dd拥有父子级关系的标签: 9.p,dt,h标签  里面不能嵌套块属性标签: 10.a标签不能嵌套a: 11.内联元素不能嵌套块:   div的display默认是block; a的display默认是 inline-

w3school 对position定义和说明是: 定义和用法: position 属性规定元素的定位类型. 说明: 这个属性定义建立元素布局所用的定位机制.任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型.相对定位元素会相对于它在正常流中的默认位置偏移. position有以下属性值: 可能的值 absolute 生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位. 元素的位置通过 "left", "top"