CSS七.....

1.dispaly:设置元素的显示方式。属性值:

block:显示为块级,占据整行,可以设置宽高。

inline:显示为行级,允许和其他元素在同一行,不可以设置宽高。

none:隐藏对象。

inline-block:行内块级,可以在同一行也可以设置宽高。

<style>
    .dis {
            width:100px;
            height:100px;
            background:#ccc;
            dispaly:none;
}
</style>
<body>
            <div class="dis"></div>
</body>

2.float:控制元素是否浮动显示,属性值:left/right/none。

<style>
    .dis {
            width:100px;
            height:100px;
            background:#ccc;
            float:right;
}
</style>
<body>
            <div class="dis"></div>
</body>

3.position:设置元素的定位。

a.absolute:绝对定位。

b.relative:相对定位。

c.fixde:固定定位。

<style>
    .dis {
            width:100px;
            height:100px;
            background:#ccc;
            position:fixed;
            right:0;
            bottom:100px;
}
</style>
<body>
            <div class="dis"></div>
</body>

  

时间: 2024-10-13 18:54:04

CSS七.....的相关文章

详解 CSS 七种三栏布局技巧

作者:林东洲 链接:https://zhuanlan.zhihu.com/p/25070186 来源:知乎 著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 三栏布局,顾名思义就是两边固定,中间自适应.三栏布局在开发十分常见,那么什么是三栏布局?比如我打开某东的首页: 映入眼帘的就是一个常见的三栏布局:即左边商品导航和右边导航固定宽度,中间的主要内容随浏览器宽度自适应. 下面围绕的这样的目的,即左右模块固定宽度,中间模块随浏览器变化自适应,想要完成的最终效果如下图所示: 红色

HTML、CSS、JavaScript的详细知识点及学习顺序

HTML.CSS.JavaScript的学习顺序一般为html,css,javascript HTML.CSS.JavaScript的详细知识点介绍: 1. HTML 包含文字.图片.视频等. 或为标题加入背景图片.颜色变化,标题字体.比如,就像网页的外衣.样式是表现.2. CSS 边框等.所有这些用来改变内容外观的东西称之为表现. 是用来实现网页上的特效效果.如:鼠标滑过弹出下拉菜单.或鼠标滑过表格JavaScript3. 的背景颜色改变.还有焦点新闻(新闻图片)的轮换.可以这么理解,有动画的

react.js 之 批量添加与删除功能

最近做的CMS需要用到批量添加图片的功能:在添加文件的容器盒子内,有两个内容,分别是:添加按钮与被添加的选择文件组件. 结构分析: 被添加的组件,我们称为:UploadQiNiuFiles(七牛文件上传组件),含一个删除当前组件的删除按钮 添加按钮的事件 被添加组件存放的容器 代码分析: 添加组件存放的容器:<div className="divBorder"> <div className="divBorder"> {addToBtn} /

移动设备web端开发笔记

Bootstrap 3 一.采用Html5文档类型<!DOCTYPE html> <html> .... </html> 二.为了让 Bootstrap 开发的网站对移动设备友好,确保适当的绘制和触屏缩放,需要在网页的 head 之中添加 viewport meta 标签,如下所示: <meta name="viewport" content="width=device-width, initial-scale=1.0"&g

jquery 事件--鼠标事件

一.click( )  与 dblclick() --双击 click事件其实是由mousedown与mouseup 2个动作构成,所以点击的动作只有在松手后才触发 在同一元素上同时绑定 click 和 dblclick 事件是不可取的. $(".div").click(function(){ alert("hello") }) $('p').click(function(e) { alert(e.target.textContent); // 打印所点击对象的文本

三栏结构布局技巧,顶了

CSS 七种三栏布局技巧 三栏布局,顾名思义就是两边固定,中间自适应,即左边商品导航和右边导航固定宽度,中间的主要内容随浏览器宽度自适应. 下面围绕的这样的目的,即左右模块固定宽度,中间模块随浏览器变化自适应,想要完成的最终效果如下图所示: 红色和蓝色宽度固定,绿色宽度自适应,下面七种方法实现的最终效果跟这个差不多,可能会稍有不同. 下面七种技巧各有千秋,在开发中可以根据实际需求选择适合自己的方法进行编码. 1. 流体布局 <!DOCTYPE html><html lang="

css3过度和动画

一.过度(transition) transition:[transition-property] || [transition-duration] || [transition-timing-function] || [transition-delay]: transition-property  参与过度属性 transition-duration  过度的持续时间 transition-timing-function  过度的动画类型 transition-delay  延迟过度的时间 注

HTTP协议探究(一)

一 复习与目标 1 复习 序章主要用WrieShark抓包HTTP报文 复习了TCP协议 讲述了TCP协议与HTTP之间的关系 HTTP1.1更新原因:HTTP1.0一次TCP连接只能发送一次HTTP报文等 HTTP2.0更新原因:HTTP的报头太大.多路复用问题等(HTTP2.0未来研究) 2 目标 由于大家都有一定的基础(包括我),所以并不会照着书本一节一节地进行,所以这一节重点讲一下缓存相关的问题. 缓存的好处 缓存相关的状态码 缓存相关的首部 缓存的处理步骤 二 为什么要有缓存? 减少冗

HTML+CSS学习笔记(七)

上次我们说到了建立CSS的三种方式,这一次我们开始将目光放在具体的实现细节上.我们知道,CSS样式规则有两个主要部分,选择器决定将格式化应用到哪些元素上,而声明则定义要应用的格式化,这一次,我们重点关注如何定义CSS选择器. 选择器可以定义五个不同的标准来选择要进行格式化的元素. 元素的类型或名称 h1{color:red;} 元素所在的上下文 h1 em{color:red}; //这里em才是被选择的元素,只应用于包含在h1中的em 元素的类和ID .error{color:red;} //