CSS 小结2：元素显示器模式

已于 2024-04-11 23:15:47 修改
阅读量228 收藏
点赞数 5
文章标签： css 前端
于 2024-04-11 23:15:02 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/nishizsnb/article/details/137652483
版权

元素显示器模式就是元素(标签)以什么方式进行显示，分为一般分为块元素和行内元素(还有行内块元素)

1.块元素

结果如图所示： 注意：文字类标签里面也不能放其他块级元素。

2.行内元素：

 

3.行内块元素：

4.元素显示模式转换：

DOU5NBV
关注
div+css网页布局小结
hua83843545的专栏
03-27 232
学习 满屏 重复图片 .top { width: 100%; height: 27px; background: url(../images/top_bg.jpg) repeat-x; } div水平居中各种设置形式 div#wrap { 　　width:980px; 　　margin:0 auto; /*这里的0可以任意值*/ 　　bord...
HTML/CSS知识点小结
CEO___的博客
04-13 910
html/css知识点小结CSS权重及其引入方式 CSS权重及其引入方式 引入方式（4种）： 内联（行内）样式：为元素添加一个style属性，属性值即为css样式。 内部样式表（内嵌样式）：在head标签下添加一个style元素标签，并在标签内编写css样式。 外部样式表（外联样式）：将页面需要的CSS写在一个单独的扩展名为.css的文件中，并用link元素引用。 导入样式表：导入样式和链接样式...
css元素与浏览器边框,别具光芒CSS属性、浏览器兼容与网页布局
weixin_39843782的博客
08-03 207
别具光芒CSS属性、浏览器兼容与网页布局语音编辑锁定讨论上传视频上传视频《别具光芒CSS属性、浏览器兼容与网页布局》是2008年人民邮电出版社出版的图书。该书结合大量范例与实际应用的实例，详细介绍了W3C发布的层叠样式表CSS2.1规范，浏览器对于CSS2.1规范解释的异同，以及使用XHTML和层叠样式表对网页进行结构化与美化的实际制作方法。书名别具光芒CSS属性、浏览器兼容与网页布局页...
CSS学习笔记
wqslqsllo的博客
10-14 482
1 介绍 1 css是w3c推出的标准 2 版本 css1, css2, css3 3 css是什么 网页分成三个部分： 结构(HTML) 表现(CSS) 行为(JavaScript) CSS - 层叠样式表 - 网页实际上是一个多层的结构，通过CSS可以分别为网页的每一个层来设置样式 而最终我们能看到只是网页的最上边一层 - 总之一句话，CSS用来设置网页中元素的样式
CSS常见选择器
qq_63218110的博客
12-04 2902
本篇博客主要介绍CSS的引入方式，选择器，常见的元素属性，以及弹性布局
Day04-CSS基础（选择器进阶+背景属性+元素显示模式+三大特性）
weixin_45831040的博客
06-30 790
作用：根据 HTML 标签的嵌套关系，选择父元素 后代中 满足条件的元素选择器语法：选择器1 选择器2 { css }结果：在选择器1所找到标签的后代（儿子、孙子、重孙子）中，找到满足选择器2的标签，设置样式注意点： 作用：根据 HTML 标签的嵌套关系，选择父元素 子代中 满足条件的元素选择器语法：选择器1 > 选择器2 { css }结果：在选择器1所找到标签的子代（儿子）中，找到满足选择器2的标签，设置样式注意点： 作用：同时选择多组标签，设置相同的样式选择器语法：选择器1 ， 选择器2 { css
HTML5+CSS3小结
七寳的专栏
07-28 479
【【【【【【【【【【【【【【【【【【【【【【【HTML5】】】】】】】】】】】】】】】】】】】】】】】】】】】】】 ------------------------------------------------------------------------------------------------------------- 不允许写的结束符的标签：area、basebr、col、co
【CSS in Depth 2 精译_014】2.4 视口的相对单位
PeacefulWinter的博客
07-03 1238
本篇为《CSS in Action》最新第二版第2.4小节全新改版内容。文章在第一版的基础上，对视口的新增相对单位做了细致入微的探讨，还进行了分类汇总。在视口相对单位的应用方面，也对旧版内容做了全新升级，新加 clamp 函数实现响应式设计，非常值得前端开发人员用心积累。
CSS 基本语法，选择器，常用元素属性，盒模型，弹性布局
1226
05-02 4534
一、什么是 CSS HTML 只是描述了页面的骨架结构和内容，使用 CSS 可以描述页面的样式，针对页面进行进一步美化 层叠样式表 (Cascading Style Sheets) CSS 能够对网页中元素位置的排版进行像素级精确控制，实现美化页面的效果，能够做到页面的样式和结构分离 具体来说，就是描述了任意一个网页的元素，大小 / 位置 / 字体 / 颜色 / 背景 / 边框… 引入了 CSS 就可以让一个页面变的好看起来，CSS 与其说是技术，不如说是 “艺术” 二、CSS 语法
css基础
m0_72711350的博客
11-03 510
css
CSS权威指南第五版-第17章 变形
leyan1618的博客
02-20 2451
CSS权威指南第五版笔记 第17章 变形
前端笔记(Html+CSS+JS+DOM+网页特效+jQuery+HTML5+CSS3+canvas 标签+web开发重难点+面向对象+AJAX)
热门推荐
qq_36609655的博客
07-02 1万+
第1章Html   Html：超级文本标记语言（HyperText Markup Language），在浏览器上运行的一种标记语言。 就是给文本加上含有语义的标签。 接下来应该学习更多具体语义标签： 一、结构（固定的结构）   <html> <head> <title></title> </head> <bod...
《Java从小白到大牛》第24章：网络编程
weixin_45521452的博客
05-29 516
第24章 网络编程 现代的应用程序都离不开网络，网络编程是非常重要的技术。Java SE提供java.net包，其中包含了网络编程所需要的最基础一些类和接口。这些类和接口面向两个不同的层次：基于Socket的低层次网络编程和基于URL的高层次网络编程，所谓高低层次就是通信协议的高低层次，Socket采用TCP、UDP等协议，这些协议属于低层次的通信协议；URL采用HTTP和HTTPS这些属于高层次的通信协议。低层次网络编程，因为它面向底层，比较复杂，但是“低层次网络编程”并不等于它功能不强大。恰恰相反，正因
WEB 前端面试题 (高能)
m0_64191440的博客
11-11 1221
我们让原型对象等于另一个原型对象的实例,此时原型对象 ,将包含一个指向原型对象的指针，再让原型对象 的实例等于原型对象，如此层层递进就构成了实例和原型的链条，这就是原型链的概念。取得了另外一个值，则原先的引用值引用次数就减 1，当这个值的引用次 数为 0 的时候，说明没有办法再访问这个值了，因此就把所占的内存给。如果你发现你在不同的地方写了大量代码来做同一件事时，就应该考虑将代码重构为可重用的。描述：给一个元素设置了高度和宽度的同时，还为其设置margin和padding的值，会改变该元素的实际大小。
【css】html里面的图片宽度设为百分比，高度要与宽度一样
smart_dream
11-12 157
外层div的宽度自适应，图片宽度不能固定数值，只能设置百分比。图片高度也不能设置固定数值。如何让图片的高度与图片的宽度一样呢？场景：展示图片列表的时候，原始图片宽高不一致。
第8章利用CSS制作导航菜单
最新发布
KO2131855283的博客
11-12 444
利用CSS为超链接重新设置样式，包括对a:link和a:visited这两个伪类的设置，以此来分别表示超链接未被访问和已被访问的状态，同时将其display属性设为block，这样就能把超链接变成块级元素，进而可以为超链接设置80像素的宽度，满足特定的页面布局需求。与此同时，针对大标题文字的 CSS 样式也要进行设定，这包括规定高度值，设置合适的行高，确定文字颜色（可依据设计风格选择不同色彩）以及文字的对齐方式（如居中对齐、左对齐等），以此来达到理想的视觉呈现效果，提升导航栏和标题的美观度与可读性。
第8章 利用CSS制作导航菜单.
w_wx8866的博客
11-11 482
我们在浏览网页的时候可以看见许多位于顶部的导航栏，供我们点击跳转。
使用HTML、CSS和JavaScript创建动态圣诞树
不迁怒，不贰过。小知识，大智慧。
11-10 1038
随着节日的临近，许多人开始装饰他们的家，以迎接温馨的节日气氛。在这个过程中，圣诞树无疑是最具代表性的装饰之一。为了庆祝这一传统，我们可以利用现代网页技术，创建一个动态的圣诞树效果，既美观又富有趣味。本文将介绍如何使用HTML、CSS和JavaScript构建一个互动的圣诞树，结合雪花飘落和闪烁的装饰球，营造出浓厚的节日氛围。通过这个项目，读者不仅能够学习到基本的网页开发技能，还能体验到创造节日氛围的乐趣。让我们一起动手，打造一个充满节日气息的网页吧！
第八章 利用CSS制作导航栏
2302_82150329的博客
11-12 647
为了美化文字内容的外观，可以设置div高度，宽度，背景，边框和文本对齐方式，为了使导航菜单始终处于最上层，需要设置z-index属性的优先值，为了使导航菜单固定于页面底部，需要设置位置属性position和各个方向的位置值。在<nav>的首尾标签之间，使用<div>标签创建菜单范围，结合无序列表<ul>和有序列表<li>标签，配合列表选项<li>创建菜单选项。利用CSS为超链接重新设置样式，例如对a：link，a：visited进行设置，表示链接未被访问和已被访问的状态。这里使用通配符“*”整体设置。
CSS选择器详解：从复合到伪类，及元素显示模式
2. CSS的元素显示模式 - **块级元素**（如div、p、h1-h6等）：独占一行，宽度、高度、内外边距可控，能容纳行内或块级元素，通常用于构建布局。 - **行内元素**（如a、strong、b等）：同行显示，宽度高度不可直接...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值