java 排版_Java 新手学习 CSS样式列表 排版 格式布局

1,样式表分为  内联样式表   内嵌样式表  外部样式表  三种。

内联样式表是直接写在标签里面的  比如

内嵌样式表是必须写在head 标签里面的  比如

p{样式}

只针对body 里的p 标签 改变样式

也可以是

div{样式(样式可以自己设定)比如 width:200px; height:50px; border:1px solid red; top:10px; left:20px;  那么div层标签的效果会是宽200高50 边框线为1像素 实线 红色实线的框, 当然也可以添加更多的样式效果在里面}

只针对body里的div标签 改变样式

这是用标签名做的 选择器  比如p层标签、div层标签

还有一种class选择器  都是“."开头的  比如

这种选择器在head标签里写完了 要在body里的层标签 里引用  比如

这种选择器的应用方式跟class一样 但是class可以被重复使用 id不能重复使用  也就是说#ab 只能在body里出现一次   如果是不同名字的# 可以被多次使用

比如#aa  可以跟#bb 同时出现在body里面

选择器种类里还有三种符合选择器

1)用,逗号隔开  表示并列  比如

这样p标签span标签和div标签可以同时执行样式的指令

2)用空格隔开  表示后代  比如

只有div标签里的p标签执行此命令 比如

这中情况下是执行 div p 样式指令的

3)(.)表示筛选  这种情况跟用空格功能基本一样

格式与布局

1)position:fixed  锁定位置是相对于浏览器的

2)position:absolute  是绝对位置   这个有两种情况

一种是外层没有position:absolute或者是relative的情况下,创建的div是相对于浏览器定位的

另一种是外层有position:absolute或者relative,那么div就会相对于外层的边框定位

3)position:relative 是相对于默认位置的定位 (绝对定位是在页面上面进行定位,相对定位是真实的在页面里面占有某一块区域,有上下左右值的时候只是进行

形状上的平移,真实占有的位置不变)

分层  z-index    在z轴方向分层,层数越高越不容易被盖住, z-index层数默认为1

float:left  right

overflow:hidden;  为超出部分隐藏   overflow:visible;显示

超链接的样式

a:link  每点击是原来的样子

a:visited  访问过的链接样式

a:hover  鼠标指向是的样式  也就是把鼠标放在上面显示的样式

opacity  透明度

33c6ed1313581ce5df159dc0bfc22c5a.png

905ddc3d0b5b677d46933119f84a0f76.png

15862c21ba7bc80dff780d3a3438e419.png

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值