CSS的再深入(更新中···)
在上一章我们提到了一个新的概念,叫做块级样式,讲到这里就要科普一下:
标签又分为两种:
(1)块级标签
元素特征:会独占一行,无论内容多少,可以设置宽高···
(2)内敛标签(又叫做行内标签)
元素特征:根据内容的多少占用空间大小,它的上下margin不起作用
(块级:P h1- h6 div ul ol dl li···)
(内敛:span img i b a em icon···)
有时,我们会使用块级标签,有时会使用内敛标签,但老是改标签是不是太麻烦了呢?有没有其它的方法呢?
答案是:有。
块级和行级(也就是内敛)可以相互转换
块级转行级
给块级添加属性:display:inline;
行级转块级
给行级添加属性:display:block;
行级块元素
给需要的元素添加属性
display:linline-block;
行级块元素好处:可以设置宽高,可以在一行,margin可使用
知识添加:
line-height 行高,可设置字体的垂直位置
line-height的值和height的值相同,文本就可以上下居中,(水平居中为text-align:center)(text-align 文本居中方式 center居中 left居左 right居右)
line-height:50px/2
当属性值中有不带单位的2时,line-height的值为2 x font-size(字体大小)的大小
CSS的再深入(更新中···)的更多相关文章
- html2canvas - 项目中遇到的那些坑点汇总(更新中...)
截图模糊 原理就是讲canvas画布的width和height放大两倍. 后来学习canvas的时候,才了解到这种写法不同于css的宽高设置, 因为css里的只是展示画布显示的大小,不像这样是c ...
- fastadmin 后台管理框架使用技巧(持续更新中)
fastadmin 后台管理框架使用技巧(持续更新中) FastAdmin是一款基于ThinkPHP5+Bootstrap的极速后台开发框架,具体介绍,请查看文档,文档地址为:https://doc. ...
- 前端面试题总结——HTML(持续更新中)
前端面试题总结--HTML(持续更新中) 1.什么是HTML? HTML:HyperText Markup Language超文本标记语言 2.XHTML和HTML有什么区别 HTML是一种基本的WE ...
- HTML+CSS基础课程-imooc-【更新完毕】
6-1 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小.颜色.字体加粗等 ...
- 【前端面试】Vue面试题总结(持续更新中)
Vue面试题总结(持续更新中) 题目参考链接 https://blog.csdn.net/weixin_45257157/article/details/106215158 由于已经有很多前辈深造VU ...
- CSS系列:在HTML中引入CSS的方法
HTML与CSS是两个作用不同的语言,它们同时对一个网页产生作用,因此必须将CSS与HTML链接在一起使用.在HTML中,引入CSS的方法主要有4种:行内式.内嵌式.导入式和链接式. 1. 行内式 行 ...
- java视频教程 Java自学视频整理(持续更新中...)
视频教程,马士兵java视频教程,java视频 1.Java基础视频 <张孝祥JAVA视频教程>完整版[RMVB](东西网) 历经5年锤炼(史上最适合初学者入门的Java基础视频)(传智播 ...
- Android开发面试经——4.常见Android进阶笔试题(更新中...)
Android开发(29) 版权声明:本文为寻梦-finddreams原创文章,请关注:http://blog.csdn.net/finddreams 关注finddreams博客:http:/ ...
- Cocos2d-x 3.0final手机游戏开发视频教程2014 - 自学编程 -(陆续更新中)
内容: 非常多人问我:沈老师,要不要更新引擎版本号到3.0,更新这么快,以后会不会每一个月都有一次,好怕呀. 我说:无论你曾经是哪个版本号,3.0final是一个架构级别的升级,能够在新项目中果断升级 ...
- 《WCF技术剖析》博文系列汇总[持续更新中]
原文:<WCF技术剖析>博文系列汇总[持续更新中] 近半年以来,一直忙于我的第一本WCF专著<WCF技术剖析(卷1)>的写作,一直无暇管理自己的Blog.在<WCF技术剖 ...
随机推荐
- Lua class
local _class = {} function class(super) local class_type = {} class_type.ctor = false class_type.sup ...
- java生成随机六位数的验证码&随机生成十位数ValidCode码,用于邮件的验证&检查是不是符合为合法的中国的手机号码
package com.demo.test1; import java.security.NoSuchAlgorithmException; import java.security.SecureRa ...
- 获取Sqlserver上一句语句执行后受影响的行数@@rowCount
from:http://blog.163.com/rihui_7/blog/static/212285143201381343240404/ 返回受上一语句影响的行数. ROWCOUNT_BIG.&q ...
- windows编程之Windows Shell 编程
参考书<VC++ Windows Shell Programming> 这里仅仅是记录下该资源,推荐到下文列出的连接进行查看 用VC++ 进行Windows Shell 扩展编成 ...
- Join The Future (剪枝 + 状态压缩)
一道暴力搜索的恶心剪枝题目. 先处理好某个点确定之后其他点的也确定的是谁,还有分别为什么情况,分别用vis,sta来记录.当然可以直接使用一个3进制数来表示,但是这里需要额外写一个三进制数求值的函数较 ...
- 动态创建 Plist 文件
简介 Property List,属性列表文件,它是一种用来存储串行化后的对象的文件.属性列表文件的扩展名为.plist ,因此通常被称为 plist文件,文件是xml格式的. 写入plist文件 在 ...
- react修改app.js添加中文内容后中文部分乱码解决
[问题]:配置完react后修改app.js内容时添加中文出现如下乱码的中文. [A解决]文档——文本编码——转换文本编码,在弹出窗口修改,确定,搞定 [B解决]首先在EditPlus内:工具——首选 ...
- BufferReader BufferWriter
Copying information from one file to another with 'BufferReader BufferWriter' public class Demo5 { p ...
- C#中对Web.Config、App.Config字符串加密与解密的方法
我们平常的项目里面的配置文件通常都是明文形式的存在,现在就是为了项目安全性增强,同时又显得高逼格点, 我们可以采用加密的方式,而我们C#很强大,因为他内置的一些指令方式,很方便而且使用起来还不用解密, ...
- web前端学习路线:HTML5教程之前端模块化开发
1. 命名冲突 首先从一个简单的习惯开始. 由于以前一直做 JavaEE 开发的缘故,在 JavaScript 开发中,我已经习惯将项目中的一些通用功能抽象出来,形成一个个的独立函数,以便于实现代码复 ...