overflow属性 hidden scroll auto

hidden 超出隐藏

scroll 滚动条

Auto 自动

display属性 block inline inline-block none

Block 块显示

inline 按行内显示

inline-block 双重作用。既有行的特点又有块的特点

在一行内显示,又具有宽高。

 

None

不显示。

Display:none;

 

CSS引入的方式 行内,内嵌,外部

行内

在标签内部,直接使用style=”CSS规则”

容易写错:<p style=”color=red;”>文字</p>

这个地方用冒号

内嵌

写在<head></head>中

写法

<style type=”text/css” >样式</style>

外部

通过link,将外部的样式表文件(*.css),引入当前页面。

写法:

<link type=”text/css”  rel=”stylesheet” href=”*.css” />

Rel说明,当前文件与链接的文件是什么关系

Stylesheet 样式表的关系。

Href:指定样式表文件在什么地方(路径)

备注:我们在做网站时开发时,通常用的就是这种方式。

CSS优先级

当CSS冲突的时候

就近原则

行内样>内嵌样式>外部样式

行内样式>id>class>标签

//权重值,特性值

标签:1

类:10

ID:100

Style:1000

!important

CSS继承

和文本相关的一般都会继承。、

边框,宽,高,margin,padding  背景等都不继承。

继承的权重为0

定位属性:position:static fixed relative absolute

position: (配合着定位坐标

Left距左边, top距上边, right 距右边, bottom距底边

)

static 静态,不定位

fixed 固定, 脱离正常的文档流,比普通元素层级要高。相对于浏览器窗口进行定位。

relative

相对定位。相对于谁?(相对于自己,霸道的相对)

absolute

绝对定位,相对于最近的具有定位属性(不管是相对定位,或者绝对定位都可以)的元素进行定位。

脱离正常文档流,层级高于普通元素。

相对于它的祖先,有定位属性的祖先。

如果没有,相对于body定位。

备注:相对定位与绝对定位

外层元素通常设置相对定位,不用坐标。

内层元素设置绝对定位。配合着定位坐标。

定位坐标:

课堂练习:限时抢

盒子模型:边框线,内填充,外边距

border 边框线

padding 内填充

margin 外边距

top,right bottom left

总宽度:(margin-left+padding-left+border-left)*2+width(内容宽度)。

总宽度问题 加DTD(IE)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

外边距合并问题

margin,上下合并(大吃小),左右叠加

常见布局PPT

个人主页

绿色案例(作业)

浏览器兼容性简介

浏览器市场份额:http://tongji.baidu.com/data/browser

常用兼容性技巧

初始化清除浏览器默认值及HACK法:

初始化清除浏览器默认值:ul,li,body{margin:0;padding:0}

.box{

color:white;

background:blue; /*ff,7*/

background:red \9; /*ie6 7 8*/

*background:black; /*ie6 7*/

_background:orange;/*ie6*/

}

IE6 双边距 问题的处理

 

IE6 1px高度的DIV

如何实现?

 

制作网站的流程

有没有域名和空间?

开发网站类型,企业网站,电子商务,移动开发

功能模块选择:如:新闻系统,会员系统,商品展示,在线支付等

模板选择:色系选择

效果图

签订合同,首次支付30%

网站开发

内部测试,在线测试

客户测试

交付使用

支付余款

合同完成

服务年费

增加功能,加个论坛,微网站(再合同)

升级服务

CSS优先级和定位的更多相关文章

  1. css优先级机制

    所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序.   1.important >(内联样式)Inline style  >(内部样式)Internal style sheet ...

  2. 前端css优先级以及继承

    1.css优先级以及继承 css具有两大特性:继承性和层叠性 继承性 继承:给父级设置一些属性,子级继承了父级的该属性,这就是我们的css中的继承. 有一些属性是可以继承下来 : color . fo ...

  3. css优先级 中文版MDN补充翻译

    原文地址:https://developer.mozilla.org/zh-CN/docs/Web/CSS/Specificity css的MDN中文版,这一页是讲css的优先级的. 读到文章的最后, ...

  4. CSS浮动、定位

    这几天有空,整理了关于CSS浮动和定位的一些知识点,有什么欠缺的地方,欢迎大家批评指正. 一.文档流的概念指什么?有哪种方式可以让元素脱离文档流? 文档流,指的是元素排版布局过程中,元素会自动从左往右 ...

  5. css选择器及css优先级

    三个css选择器:id选择器#test1{ }.class选择器.test2{ }.标签选择器div{ }对三个div:<div>我是普通div</div>.<div i ...

  6. 关于CSS的优先级,CSS优先级计算

    原则一: 继承不如指定原则二: #id > .class > 标签选择符原则三:越具体越强大原则四:标签#id >#id ; 标签.class > .class CSS优先级权 ...

  7. css 优先级 机制

    多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下: (外部样式)External style sheet ...

  8. z-index、display、selector选择器优先级css优先级面试用到

    z-index:控制元素叠放顺序,哪个z-index数值越大,那个优先被叠放在上面. relative.absolute.fixed这三种情况可以使用z-index. static不可以使用. dis ...

  9. css优先级和层叠

    css优先级和层叠 1.优先级    计算方法:        a.行内样式        b.id选择器的数量        c.类,伪类和属性选择器的数量        d.标签选择器和伪元素选择 ...

随机推荐

  1. Keeweb-Linux的密码管理器

    Keeweb-Linux的密码管理器 如今,我们依赖于越来越多的线上服务.我们每注册一个线上服务,就要设置一个密码:如此,我们就不得不记住数以百计的密码.这样对于每个人来说,都很容易忘记密码.那么,下 ...

  2. thinkphp5多图上传 js部分

    在项目中常会用到多图上上传,那就需要多图上传后需要预览,并且能删掉传错(不想传)的图,然而 测试了半天 并不知道jq怎么写,parent()parents()用了半天无果,罢了,还是用原生js来写.这 ...

  3. JDK1.8源码(四)——java.util.Arrays 类

    java.util.Arrays 类是 JDK 提供的一个工具类,用来处理数组的各种方法,而且每个方法基本上都是静态方法,能直接通过类名Arrays调用. 1.asList public static ...

  4. mysqldump 备份脚本

    #!/bin/bash DUMP=/usr/bin/mysqldump OUT_DIR=/home/mysql LINUX_USER=root DB_NAME=snale DB_USER=root D ...

  5. Spring MVC核心技术

    目录 异常处理 类型转换器 数据验证 文件上传与下载 拦截器 异常处理 Spring MVC中, 系统的DAO, Service, Controller层出现异常, 均通过throw Exceptio ...

  6. 基于hi-nginx的web开发(python篇)——cookie和会话管理

    hi-nginx通过redis管理会话. 要开启管理,需要做三件事. 第一件开启userid: userid on; userid_name SESSIONID; userid_domain loca ...

  7. php中heredoc与nowdoc的使用方法

    一.heredoc结构及用法 Heredoc 结构就象是没有使用双引号的双引号字符串,这就是说在 heredoc 结构中单引号不用被转义.其结构中的变量将被替换,但在 heredoc 结构中含有复杂的 ...

  8. 『开源』设置系统 主音量(0~100 静音) VolumeHelper 兼容 Xp Win7 .Net 20 AnyCPU

    背景: 近来的生活一团乱麻,没心态写高大上的代码,于是就着手 写了几个 辅助类. 在整理 InkFx.Utils 时,发现有几个 辅助类 只写了定义,没有实现函数体,于是就 花了1天时间 完善了一下. ...

  9. python 面向对象的程序设计

    一:什么是编程范式? 编程是程序员用特定的语法 + 数据结构 + 算法组成的代码来告诉计算机如何执行任务的过程. 如果把编程的过程比喻为练习武功,那么编程范式指的就是武林中的各种流派,而在编程的世界里 ...

  10. 冲刺总结随笔(Alpha)

    冲刺总结随笔 听说 031502543 周龙荣(队长) 031502615 李家鹏 031502632 伍晨薇 031502637 张柽 031502639 郑秦 1.项目预期进展及现实进展 项目预期 ...