- 博客(13)
- 收藏
- 关注
原创 CSS选择器
1、交集选择器交集选择器是由两个选择器直接连接构成的,selector1.selector2,其中selector1必须是标签选择器,selector2可以是类别选择器、id选择器、或伪类选择器、伪元素选择器,两个选择器之间不能有空格,必须连续书写。p.one{ color:red; font-size:16px;}h1#two{ font-size:30px; color:blue;}2、派生选择器1)后代选择器selector1 select
2022-05-05 23:02:46
2030
原创 CSS实线鼠标移入显示隐藏div
用CSS中的 hover 事件,实线鼠标移入显示隐藏元素。效果如下:代码如下:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>移入显示</title> <style> .hov{ width: 300px; background-color: #FFA500; border-radius:..
2022-04-08 22:25:43
7585
原创 HTML和CSS制作跳动的心
首先做两个圆,给两个圆添加定位使一部分重叠其形成如下形状。在做一个正方形,给它做旋转和定位,与上面两个圆组合成如下形状。最后给这个心添加动画就可以了。具体代码如下:<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.
2022-04-06 20:47:53
2000
原创 高度塌陷的解决方法
在文档流中父元素的高度默认是被子元素撑开的,也就是子元素多高,父元素就是多高但是当为子元素设置浮动以后,子元素会完全脱离文档流,此时导致子元素无法撑起父元素,导致父元素塌陷。由于父元素的高度塌陷了,则父元素下面的元素都会向上移动,这样将会导致页面布局混乱的。 所以在开发中一定要避免出现塌陷问题,解决塌陷问题: 1、我们可以将父元素的高度写死,以避免塌陷的问题出现,但是一旦写死父元素高度,父元素的高度将不能自动适应子元素的高度,所以这种方案是不推荐...
2022-04-03 14:13:30
857
原创 浮动与高度塌陷问题的解决办法
浮动块元素在文档流中默认垂直排列,如果希望块元素在页面中水平排列,可以使块元素脱离文档流,使用float来使元素浮动,从而脱离文档流float 可选值 none 默认值元素会在文档流中排列 left 元素会立即脱离文档流,向页面左侧浮动 right 元素会立即脱离文档流,向页面右侧浮动 inherit 元素会继承其父级的 float 值 none 该属性是默认属性,元素会在文档流中排列,当我们给元素添加该属性后,与原来的效果一样。由下图可以看出三个...
2022-04-02 14:55:01
120
原创 内联元素与块元素
目录内联元素的盒模型内边距外边距display和visibilityoverflow文档流 一、块元素 二、内联元素内联元素的盒模型内边距 内联元素不能设置width和height,只能由元素内容撑起来。 内联元素可以设置水平方向的内边距 内联样式可以设置垂直方向的内边距,但是不会影响页面的布局。 为元素设置边框,内联...
2022-03-26 20:27:57
548
原创 内边距与外边距
内边距内边距指的是内容区与盒子边框之间的距离,无论是内边距还是外边距,都有上、下、左、右四个值,分别对应四个子属性: -padding-top 上内边距 -padding-right右内边距 -padding-bottom 下内边距 -padding-left 左内边距内边距会影响盒子可见框的大小,元素的背景会延伸...
2022-03-25 18:07:44
10761
原创 HTML表单
HTML表单的使用无论是百度的搜索框还是网易邮箱的注册,或是学习强国的答题,这些页面都有一个共同的特点,需要用户输入或是选择数据。这些通过和用户交互来实现的功能,需要表单元素来实现。
2022-03-15 20:47:36
2784
原创 HTML 标签
文本是网页的基本元素,在<body> 标签中直接插入文本,即可显示在网页页面中。例如:标题段落标签 在网页制作规范中,网页的内容需要用标题来呈现文档结构,标题类似于文章的大纲。标题 是通过 <h1>~</h6> 标签进行定义的, <h1> 用于定义最大级别的标题。<h6> 用于定义最小级别的标题。 HTML 规则中对6级标题段落标签设置了默认样式,,包含加粗、字号、上下间距,每一级的字号和上下间距值如下表所示。运行...
2022-03-06 01:19:51
4145
原创 介绍HTML5
认识HTML5HTML5 是最新的HTML标准,是网站设计和开发必不可少的技术。HTML5 是一款超文本标记语言,它包括一系列的标签,通过这些标签可以将网络上的文档格式统一,使分散的资源成为一个逻辑整体。HTML5 拥有新的语义、图像及 多媒体元素,并且是跨平台的,被设计在不同类型的终端上运行。认识各种开发工具HTML 被称为超文本标记语言,网页文档归根结底也是一个文本文档,我们甚至可以用“记事本”来编写或查看网页文档,但要更好的编写网页脚本,实现网页开发,还你需要选择一种功能强大的编辑工具,下面就介
2022-02-27 13:33:45
7931
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人