首页 > 其他分享 >黑马pink css3

黑马pink css3

时间:2023-11-11 19:45:01浏览次数:42  
标签:pink css3 行内 块级 元素 宽度 黑马

行内元素/内联元素:是最典型的行内元素
特点:
相邻行内元素在一行上,一行可以显示多个
高,宽度设置是无效的
默认宽度是他本身内容的宽度
行内元素只能容纳文本或其他行内元素
注意:
内部不能嵌套‘
可以嵌套块级元素

行内块元素:‘
特点:
一行可以有多个,之间有空隙
默认宽度是他本身内容的宽度
高度,宽度,外边距和内边距都可以控制(块级元素特点)

显示模式的转换(重要):例如增加的触发范围
display:block inline inline-block
转换为块级元素,行内块是对多的,因为需要宽度和高度

标签:pink,css3,行内,块级,元素,宽度,黑马
From: https://www.cnblogs.com/SKEZhi/p/17819227.html

相关文章

  • 5.CSS3制作苹果风格键盘
    CSS3制作苹果风格键盘HTML代码:1<!DOCTYPEhtml>2<html>3<head>4<metacharset="utf-8"/>5<title>CSS3KeyBoard-Linux公社-Linux系统门户网站</title>6<!--<linkrel="stylesheet"href......
  • CSS3 实现动态旋转加载样式
    CSS3实现动态旋转加载样式要使用CSS3创建一个动态旋转加载样式,你可以使用CSS动画和旋转变换。下面是一个简单的示例:HTML:<divclass="loader"></div>CSS:.loader{width:50px;height:50px;border:4pxsolid#3498db;border-top:4pxsolidtransparent;......
  • 黑马pink html2
    的name属性,帮助区分标签和归类,单选按钮和复选框的name值必须是相同的。的value属性定义了默认值。的checked规定了初始由谁选中checked="checked"可以选择文件标签可以绑定一个表单元素,当光标点击标签时,就可自动选择表单元素:label的for属性和input的id属性一致其他表单控件......
  • 黑马pink学前端 html1
    单标签“”利用vscode快速创建html页面:输入"!"AutoRenameTag:插件,同步修改标签更改vscode的文本格式化的设置,使得保存时自动对齐文本openinbrowser:插件,右键菜单里有打开网页liveserver(推荐):保存之后即可动态更新,无需刷新页面vscode-icons:显示文件的类型图标easy-......
  • 黑马git学习笔记
    安装及配置1.安装淘宝镜像,选择最新版本即可https://registry.npmmirror.com/binary.html?path=git-for-windows/根据系统选择对应的版本2.配置用户名密码gitconfig--globaluser.name[用户名]#配置用户名gitconfig--globaluser.email[邮箱]#配置邮箱查看配......
  • 黑马程序员2023新版JavaWeb开发教程学习笔记
    前言该笔记灵感来源于B站《黑马程序员2023新版JavaWeb开发教程,实现javaweb企业开发全流程(涵盖Spring+MyBatis+Springboot》源视频地址:黑马程序员2023新版JavaWeb开发教程个人声明:本文记录个人在进行该视频学习中的知识总结,帮助大家能更快地进行对该视频内容的学习;由于该视频对......
  • CSS3属性详解(一)文本 盒模型中的 box-ssize 属性 处理兼容性问题:私有前缀 边框 背景属
    CSS3是用于为HTML文档添加样式和布局的最新版本的层叠样式表(CascadingStyleSheets)。下面是一些常用的CSS3属性及其详细解释:border-radius:设置元素的边框圆角的半径。可以使用四个值设置四个不同的圆角半径,也可以只使用一个值来设置统一的圆角。box-shadow:创建一个元素的阴影效果......
  • HTML5+CSS3+移动web 前端开发入门笔记(一)
    千古前端图文教程千古前端图文教程git的使用Git是一个分布式版本控制系统,它的作用主要包括以下几个方面:版本管理:Git可以跟踪文件的修改历史,记录每次提交的内容、时间和作者等信息。通过Git,开发人员可以轻松地查看和比较不同版本之间的差异,回滚到历史版本或者创建新的分支。多人协作......
  • html+css3+anime.js实现线条来回滑动且渐隐动画
    效果: 代码:<!DOCTYPEhtml><html><head><metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"/><metaname="viewport"content="width=device-width,initial-sc......
  • html+css3+anime.js实现文字故障动画
    记录一个很酷的动画,效果如图: 是基于html+css3+anime.js实现的,看了眼代码,其实是默认文字的div中定位了几个相同的文字块,利用clip-path这个属性去裁剪展示其中的一部分,用于展示故障的效果,动画则是使用anime.js去循环改变X与Y轴的位置,同时调整绘制的颜色,demo代码如下:<!DOCTYPEh......