html+css学习笔记010-垂直对齐0指针0透明

Author:Mr.柳上原

  • 付出不亚于任何的努力
  • 愿我们所有的努力,都不会被生活辜负
  • 不忘初心,方得始终

“年轻人犯情绪问题等于白痴”

这是很久以前一位上司给我说过的话

现在回头想想

真正想要控制自己的情绪,真的好难

耿直和老好人的性格

无法达到平衡点

稍微有点倾斜

不是被人觉得是当枪使的白痴

就是被认为是阴翳的小人

生活就是这样阴晴不定前路茫茫

<!DOCTYPE html> <!-- 文档类型:标准html文档 -->

<html lang='en'> <!-- html根标签 翻译文字:英文 -->

<head> <!-- 网页头部 -->

<meat charset='UTF-8'/> <!-- 网页字符编码 -->

<meat name='Keywords' content='关键词1,关键词2'/>

<meat name='Description' content='网站说明'/>

<meat name='Author' content='作者'/>

<title>前端59期学员作业</title> <!-- 网页标题 -->

<link rel='stylesheet' type='text/css' href='css/css1.css'/> <!-- 外链样式表 -->

<style type='text/css'> /*内部样式表*/

vertical-align:middle; /* 垂直对齐方式:适用于inline,inline-block元素 */  /* line-height并不能使文字完全垂直居中对齐 */
baseline 与文字基线对齐
/* 没文字时,盒子与基线对齐
    有文字时,盒子里的文字基线与外面的文字基线对齐
 */
top 与line-height顶端对齐
middle 与 line-height 文字 的中间对齐
bottom 与line-height底部对齐

text-top 与文字顶部对齐
text-bottom 与文字底部对齐

/* 多个inline-block盒子并排的时候,都要设置vertical-align */

/* 解决盒子中img元素与下边框出现间隙的两种方法(图片与文字基线对不齐)
1.img{display:block;}
2.img{vertical-align:middle; /* 垂直对齐方式:相对于父元素垂直居中 默认baseline */}
 */

cursor:default; /* 定义光标类型 */
default 默认
move 移动
pointer 小手
wait 等待
url('images'),move; 自定义图片光标

opacity:0; /* 透明度:数值0~1,子元素也会被透明 */
ie浏览器兼容方法:
filter:alpha(opacity=0~100)

</style>

</head>

<body> <!-- 网页主干:可视化区域 -->

<div id='wrap' class='wrap'>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</div>

</body>

</html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏前端布道

CSS3实现多种背景效果

重复平铺的几何图案很美观,但看起来可能有一些呆板。其实自然界中的事物都不是以无限平铺的方式存在的。即使重复,也往往伴随着多样性和随机性。因此为了更自然一些,我们...

1123
来自专栏从零开始学 Web 前端

从零开始学 Web 之 CSS(四)CSS初始化、定位、overflow、标签规范

CSS初始化是指重设浏览器的样式。不同的浏览器默认的样式可能不尽相同,所以开发时的第一件事可能就是如何把它们统一。如果没对CSS初始化往往会出现浏览器之间的页面...

983
来自专栏向治洪

react-native之ART绘图详解

背景 在移动应用的开发过程中,绘制基本的二维图形或动画是必不可少的。然而,考虑到Android和iOS均有一套各自的API方案,因此采用一种更普遍接受的技术方案...

9008
来自专栏AndroidTv

前端入门5-CSS弹性布局flex声明正文-弹性布局flex

作为一个前端小白,入门跟着这四个来源学习,感谢作者的分享,在其基础上,通过自己的理解,梳理出的知识点,或许有遗漏,或许有些理解是错误的,如有发现,欢迎指点下。

952
来自专栏WebDeveloper

那些经常使用的 CSS3属性

872
来自专栏coding for love

CSS常用布局实现01-水平居中

居中是我们平常遇到的很常见的一种布局方式,主要分为水平居中,垂直居中,水平垂直居中。每种情况又分为,已知宽度,不知宽度,对块级元素居中,对行内替换元素水平居中,...

981
来自专栏前端说吧

css笔记 - 张鑫旭css课程笔记之 overflow 篇

如果overflow-x、overflow-y的值相同,则等同于overflow设置了这个值。

1041
来自专栏cnblogs

CSS3新特性应用之用户体验

一、光标 新增加not-allowed光标,不允许访问 隐藏光标,在触模应用上很有用,css2.1需要一个透明的图片来实现,而css3直接用cursor:non...

2088
来自专栏Coco的专栏

谈谈一些有趣的CSS题目(五)-- 单行居中,两行居左,超过两行省略

955
来自专栏LIN_ZONE

css 中 zoom和transform:scale的区别(转载)

还在几年前,zoom还只是IE浏览器自己私有的玩具,但是,现在,除了FireFox浏览器,其他,尤其Chrome和移动端浏览器已经很好支持zoom属性了:

863

扫码关注云+社区