垂直对齐图像文字

vertical-align:text-top;　　图像的顶部与同一行中最高的图像或文本的顶部对齐

<img src="data:images/cake01.jpg" style="vertical-align:text-top;">

vertical-align:text-bottom;　　图像的底部与文本的底部对齐

<img src="data:images/cake02jpg" style="vertical-align:text-bottom;">

vertical-align:middle;　　图像的中心与同一行中其他内容的中心对齐

<img src="data:images/cake03jpg" style="vertical-align:middle;">

vertical-align:baseline;　　像的底部与文本的基线对齐

<img src="data:images/cake04.jpg" style="vertical-align:baseline;">

HTML、CSS笔记（一）的更多相关文章

  1. HTML+CSS笔记 CSS笔记集合

    HTML+CSS笔记 表格,超链接,图片,表单 涉及内容:表格,超链接,图片,表单 HTML+CSS笔记 CSS入门 涉及内容:简介,优势,语法说明,代码注释,CSS样式位置,不同样式优先级,选择器, ...

  2. CSS笔记--选择器

    CSS笔记--选择器 mate的使用 <meta charset="UTF-8"> <title>Document</title> <me ...

  3. HTML+CSS笔记 CSS中级 一些小技巧

    水平居中 行内元素的水平居中 </a></li> <li><a href="#">2</a></li> &l ...

  4. HTML+CSS笔记 CSS中级 颜色&长度值

    颜色值 在网页中的颜色设置是非常重要,有字体颜色(color).背景颜色(background-color).边框颜色(border)等,设置颜色的方法也有很多种: 1.英文命令颜色 语法: p{co ...

  5. HTML+CSS笔记 CSS中级 缩写入门

    盒子模型代码简写 回忆盒模型时外边距(margin).内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的:上右下左. 语法: margin:10px 15p ...

  6. HTML+CSS笔记 CSS进阶再续

    CSS的布局模型 清楚了CSS 盒模型的基本概念. 盒模型类型, 我们就可以深入探讨网页布局的基本模型了.布局模型与盒模型一样都是 CSS 最基本. 最核心的概念. 但布局模型是建立在盒模型基础之上, ...

  7. HTML+CSS笔记 CSS进阶续集

    元素分类 在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1&g ...

  8. HTML+CSS笔记 CSS进阶

    文字排版 字体 我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性. 语法: body{font-family:"宋体";} 这里注意不要设置不常用的字体,因为如果 ...

  9. HTML+CSS笔记 CSS入门续集

    继承 CSS的某些样式是具有继承性的,那么什么是继承呢?继承是一种规则,它允许样式不仅应用于某个特定html标签元素,而且应用于其后代(标签). 语法: p{color:red;} <p> ...

  10. HTML+CSS笔记 CSS入门

    简介: </span>年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发一个新的<span>脚本解释程序</span>,作为ABC语言的一种继承. & ...

随机推荐

  1. 初探富文本之OT协同算法

    初探富文本之OT协同算法 OT的英文全称是Operational Transformation,是一种处理协同编辑的算法.当前OT算法用的比较多的地方就是富文本编辑器领域了,常用于作为实现文档协同的底 ...

  2. 用Java写一个PDF，Word文件转换工具

    前言 前段时间一直使用到word文档转pdf或者pdf转word,寻思着用Java应该是可以实现的,于是花了点时间写了个文件转换工具 源码weloe/FileConversion (github.co ...

  3. 饮料换购【第六届蓝桥杯省赛C++A/C组,第六届蓝桥杯省赛JAVAB组】

    饮料换购 乐羊羊饮料厂正在举办一次促销优惠活动.乐羊羊C型饮料,凭3个瓶盖可以再换一瓶C型饮料,并且可以一直循环下去(但不允许暂借或赊账). 请你计算一下,如果小明不浪费瓶盖,尽量地参加活动,那么,对 ...

  4. wkhtmltopdf 目录对象使用 及 目录样式分享

    最近又是更新了报告模板的样式新使用了目录对象 因为直接生成的目录样式比较丑所以这边使用的是自定义xsl 直接生成的目录样式 自定义样式 因为需求所以写了些特殊判断 <xsl:if test=&q ...

  5. 【力扣】2400. 恰好移动 k 步到达某一位置的方法数目

    题目 2400. 恰好移动 k 步到达某一位置的方法数目 解题思路 观察上面示例,容易画出下面的递归树,因此可以考虑DFS. DFS 很容易写出DFS的代码 class Solution { int ...

  6. （转载）零日攻击(Zero-Day Attacks)

    零日攻击是网络安全行业中十分常见的攻击方式之一,其具有很大的突发性与破坏性,那么零日攻击是什么?如何防范零日攻击?以下是详细的内容介绍. 零日攻击是什么? 零日漏洞或零时差漏洞通常是指还没有补丁的安全 ...

  7. Coolify系列01- 从0到1超详细手把手教你上手Heroku 和 Netlify 的开源替代方案

    什么是Coolify 一款超强大的开源自托管 Heroku / Netlify 替代方案 coolLabs是开源.自托管和以隐私为中心的应用程序和服务的统称 为什么使用Coolify 只需单击几下即可 ...

  8. Golang编译

    SET CGO_ENABLED=0 SET GOOS=darwin SET GOARCH=amd64 go build main.go SET CGO_ENABLED=0 SET GOOS=linux ...

  9. 练习_使用递归计算1-n之间的和-练习_使用递归计算阶乘

    练习_使用递归计算1-n之间的和 定义一个方法,使用递归计算1-n之间的和 1+2+3+. . .+n n+(n-1)+(n-2)+...+1 已知: 最大值:n 最小值:1 使用递归必须明确: 1. ...

  10. Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to 解决办法

    main.js 配置如下 import Router from 'vue-router'; //路由导航冗余报错(路由重复) const originalPush = Router.prototype ...