css基础:格式与布局
1.定位:position:fixed;锁定位置,相当于屏幕位置锁定,不随页面移动。
position:absolute;绝对位置,相对于页面定位,随页面移动。
position:relative;相对位置,相对于页面内周边元素的位置,要注意与周围元素的关系,避免相互排挤。
2.其他属性:z-index:n;该层设置为第n层,三维布局,在z轴方向分层,可理解为摞纸。
float:left;横向左侧排列,横向流式布局,超出边框后自动排在下一行;right 横向右侧排列。
overflow:hidden;超出部分隐藏;scroll 显示出滚动条。
min-width:4px;最小宽度。
border-radius:5px;边框圆角,可填像素或百分比。
box-shadow:5px 5px 5px black;边框阴影:向右 向下 虚化5px 黑色。
text-shadow:5px 5px 5px black;文字阴影:向右 向下 虚化5px 黑色。
transition:0.5s;渐变效果,变化时间为0.5s。
transform:rotate(360deg);旋转360度。
margin-left:10px;向右平移10px。
opacity:0.5;半透明效果,50%透明效果
a:hover {color:red;鼠标指向链接时颜色变为红色;cursor:pointer;鼠标指到上面时的形状;}
css基础:格式与布局的更多相关文章
- 一起学HTML基础-格式与布局fixed/absolute/relative/z-index/float
很多网页都存在一个悬浮的操作条或者广告区,无论如何上下滚动网页,操作条或广告区都不会动,这个就是div制作,位置锁定在屏幕指定位置,现在我们就学习下网页的格式与布局. position 位置,来给di ...
- css基础-定位+网页布局案例
position:static 忽略top/bottom/left/right或者z-index position:relative 设置相对定位的元素不会脱离文档流 position:fixed 不 ...
- css基础-2 div布局
div布局 <html> <head> <title>div布局 </title> <meta charset="utf-8" ...
- 关于CSS格式与布局中的基础知识的简单操作
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- css基础 引用方式 标签选择器 优先级 各式布局
今天讲的css基础,了解了css即层叠式表,是美化网页,控制页面的样式. 样式表引进网页的3种方式1内联式,语法例子:<div style="width: 100px;height: ...
- 前端开发:css基础知识之盒模型以及浮动布局。
前端开发:css基础知识之盒模型以及浮动布局 前言 楼主的蛮多朋友最近都在学习html5,他们都会问到同一个问题 浮动是什么东西? 为什么这个浮动没有效果? 这个问题楼主已经回答了n遍.今天则是把 ...
- css样式表 格式与布局
1 样式表 内联样式表 内嵌样式表 外部样式表 2 选择器 标签选择器 <style type="text\css" class 选择器 以.开头 ID选择器 以#开 ...
- css样式表:样式分类,选择器。样式属性,格式与布局
样式表分类: 1.内联样式表, 和html联合显示,例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独 ...
- 前端总结·基础篇·CSS(一)布局
目录 这是<前端总结·基础篇·CSS>系列的第一篇,主要总结一下布局的基础知识. 一.显示(display) 1.1 盒模型(box-model) 1.2 行内元素(inline) &am ...
- css样式,边界和边框,格式和布局
1.大小:width:宽:heigh:高 2.背景:1)background-color:背景颜色 2)background-image:背景图片url路径 3)background-repeat:图 ...
随机推荐
- 还在为CSS布局发愁?你该看看这7条原则
一.网页结构分析七条原则 这以下7个原则是经过多年网站实战经验之后的总结,只要掌握这7个原则,可以解决大部分在编写网站布局中的问题. 1.先结构后样式. 2.能用CSS表现出来的效果,就尽量少用图像. ...
- 整理自己的.net工具库
前言 今天我会把自己平日整理的工具库给开放出来,提供给有需要的朋友,如果有朋友平常也在积累欢迎提意见,我会乐意采纳并补充完整.按照惯例在文章结尾给出地址^_^. 之前我开放其他源码的时候(Framew ...
- 含有n个元素的整型数组,将这个n个元素重新组合,求出最小的数,如{321,3,32},最小的数为321323
public class GetMinNumber { public static void main(String[] args) { String[] arr = null; System.out ...
- LoadRunner入门(一)
以LR自带的web系统为例(前提条件:已安装好lordrunner 11 ): 一.WebTours系统 是lordrunner自带一个飞机订票系统网站,支持IE浏览器 1. WebTours服务启动 ...
- Java的原始类型自动包装与解包机制
java5之后对原始数据类型如int.char.long等基本数据类型有自动打包成相应的复合类型Integer.Character.Long等的机制:也可以将复合类型自动转换为原始类型. 这取决于程序 ...
- RabbitMQ入门与使用篇
介绍 RabbitMQ是一个由erlang开发的基于AMQP(Advanced Message Queue)协议的开源实现.用于在分布式系统中存储转发消息,在易用性.扩展性.高可用性等方面都非常的优秀 ...
- <未来世界的幸存者> 读后感(现实篇和职业篇)
摘要: 前几天有幸看到阮老师的 <未来世界的幸存者)>,花了几晚的时间阅读完毕,内心受到了很大的触动,现在将感觉不错的地方记录下. 职业篇 1. 为什么雇佣制度对工人不利? 雇佣制度是一种 ...
- C#使用Xamarin开发可移植移动应用(3.进阶篇MVVM双向绑定和命令绑定)附源码
前言 系列目录 C#使用Xamarin开发可移植移动应用目录 源码地址:https://github.com/l2999019/DemoApp 可以Star一下,随意 - - 说点什么.. 嗯..前面 ...
- Ubuntu 14.04.4 下 scp 远程拷贝提示:Permission denied, please try again. 的解决办法
我在 s0 主机上远程拷贝 /etc/hosts 文件到 s1 主机上,出现下面的错误提示: qiao@s0:~$ scp /etc/hosts root@s2:/etc/root@s2's pass ...
- 优先级队列Priority_queue
定义 拥有权值观点的queue,,一个是返回最高优先级对象,一个是在底端添加新的对象.这种数据结构就是优先级队列(Priority Queue) . 实现 利用max_heap完成,以vector表现 ...