![](https://img-blog.csdnimg.cn/20190927151043371.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
HTML与CSS
HTML与CSS部分
此鱼非闲鱼也
烦恼像根葱,往里一看全是空!
展开
-
原生js实现倒计时
倒计时的实现倒计时是web开发中常见的组件, 请完成second和render两个函数, 完成倒计时的显示部分1、 second函数的输入为整数, 返回 { day: Int, hour: Int, min: Int, second: Int }2、 render函数的输入为second函数的输出, 将数据在页面对应的DOM元素上显示出来, 格式如html所示3、 如果day为0, 隐藏对应的DOM元素, 否则显示( 请直接使用已经实现的css代码)4、 数值不足两位, 前面补充0<!DO原创 2021-07-30 23:20:29 · 326 阅读 · 0 评论 -
前端学习-定位
1、相对定位(1)相对的是自身原有的位置(2)相对定位移动后会保留原有的位置(可以使用定位占用,但普通写法时无法占用)(3)不会影响文档流position: relative; 开启相对定位left:50px; 距离屏幕左侧50像素,即元素向右移动50pxtop:50px; 距离屏幕上侧50像素,即元素向下移动50px相对定位适用场景:(1)小范围的移动使用(2)移动后原有位置不...原创 2020-01-27 20:05:29 · 192 阅读 · 0 评论 -
前端学习-CSS选择器
css选择器的优先级!important > 行间样式 > id选择器 > class选择器||属性选择器 > 标签选择器 > 通用选择器css样式存在继承性:1.父级的样式会继承给子级2.如果子级不需要,单独调整子级即可使用css选择器基本流程:1、 制作所需的选择器,并在其中写入样式2、将选择器绑定到 指定的html标签上css选择器(1)标签选...原创 2020-01-26 20:17:30 · 124 阅读 · 0 评论 -
前端学习-浮动
float浮动:使元素脱离文档流float:none;无(默认)float:left; 向左浮动float:right;向右浮动1).所有的元素都可以浮动。2).具有float属性元素在父标签中是不占空间的。3).float能解决标签之间有间隙的问题auto:根据自身所占位置自动居中(1)自身必须有宽高(2)inline-block和float都会使auto失效,需要设置具体值...原创 2020-01-23 21:08:41 · 203 阅读 · 0 评论 -
前端学习-盒模型
盒子由 margin(外间距) , border(边框) , padding(内间距) , content (内容)标准盒模型(默认):元素(块元素或者内联块元素)的实际大小:内容+padding+borderwidth和height只是设置盒模型中的内容的大小内容区域的对齐方式:text-align, vertical-align, line-height如下图: margin...原创 2020-01-19 22:57:26 · 94 阅读 · 0 评论 -
前端学习- 常用标签(table表格与form表单)
1、表格<table></table> 标签定义 HTML 表格。简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。<tr> 元素定义表格行,<th> 元素定义表头(如果有需要的话,表格的第一行替代所有的td),td 元素定义表格单元。更复杂的 HTML 表格也可能包括 <caption>...原创 2020-01-17 20:10:18 · 889 阅读 · 0 评论 -
前端学习--常用标签及属性(超链接a标签与img图片标签)
属性 值 描述alt text 图片尚未加载出来时显示的提示信息。src URL 显示图片的加载路径。title text 鼠标移动到图片上的显示的提示信息height px 图片的高度,单位像素 width px 图片的宽度,单位像素原创 2020-01-15 21:56:49 · 3488 阅读 · 0 评论 -
前端学习-HTML文档结构
文档结构html: 整个文件的主体标签,所有的代码都不允许超出它的范围head: 页面头部信息。用于向浏览器提供整个页面的基本信息,但是不包含页面主体内容,头部信息主要包括页面的标题,元信息,CSS样式,JavaScript脚本等。body: 网页的正文,是用户在浏览器窗口中能够看到的信息,比如:图片,表格,视频等。需要在标签之内,但不是所有标签都是可见的html,head,body 是H...原创 2020-01-14 17:05:15 · 173 阅读 · 0 评论