web前端基础
文章平均质量分 57
孤雁+
这个作者很懒,什么都没留下…
展开
-
Web前端基础(十):CSS实现水平垂直居中的方式
CSS实现水平垂直居中的方式原创 2022-04-06 10:05:32 · 1866 阅读 · 0 评论 -
Web前端基础(九):CSS的position属性与其他
一、margin负值的使用方法在margin-bottom: -1px;border-bottom: 1px solid black;然后在包含的这个块中写——overflow: hidden;二、position定位、z-indexposition:static(默认)\inherit(继承)\fixed(相对于窗口定位)\relative(相对定位)\absolute(绝对定位)position:fixed; 设置:top: ; bottom: ; left: ;原创 2022-03-29 17:56:31 · 732 阅读 · 0 评论 -
Web前端基础(八):CSS模块开发细则
设计普通模块流程?选择标签——布局样式——文本样式——代码优化一、空隙问题多个行元素并排显示,默认状态下,行元素之间会存在间隙,这个间隙由HTML文件中的空格引起,解决方案是给行元素设置浮动。二、浮动对元素的影响可以让块元素并排显示;在不设置宽高的情况下,宽高由内容决定;元素会脱离文档流;行元素浮动,可以设置宽高;三、a 标签的4个伪类:link ( a标签还未被访问的状态 – href 属性 ):visited ( a标签已被访问过的状态 ):hover ( 鼠标悬停在a原创 2022-03-22 15:24:29 · 1036 阅读 · 0 评论 -
Web前端基础(七):CSS选择器进阶
1、后代选择器使用多个选择器的组合来找到要控制的标签;类名为wrap中的div里面的span标签样式;选择器直接用空格隔开。/*样式如下:*/.wrap div { background-color: skyblue;}div class="wrap"> div>01div> div>02div>div>效果解释:类名wrap的div原创 2018-02-07 09:53:59 · 333 阅读 · 0 评论 -
Web前端基础(五):清浮动方法与优缺点
1、如何对待美工对于靠谱美工,美工图精确度约0px。对于不靠谱的美工,要与产品经理沟通,并用邮件往来。2、浮动对文档的影响浮动会导致当前元素脱离文档流,此时会对父级产生影响;子元素浮动,父级元素会出现高度为0的现象,这个现象叫做高度塌陷;3、清浮动的方法:3.1 需要清浮动的情况:子标签浮动后,父标签的高度无法被撑开,所以需要清浮动;新加入的标签...原创 2018-01-30 09:09:30 · 390 阅读 · 0 评论 -
Web前端基础(六):盒模型的用法—margin详解
1、正常元素设置两个元素设置纵向外边距后,外边距会重叠,两元素间的距离是较大的那个纵向margin值。两个元素设置横向外边距后,两个元素间的距离是外边距相加之和。——设置横向,如在div中嵌套span。2、脱离文档流设置如果两元素浮动,两元素之间的距离为外边距相加之和。3margin负值的使用方法在margin-bottom: -1px;border-bottom原创 2018-02-05 10:29:56 · 1177 阅读 · 0 评论 -
Web前端基础(四):HTML元素的分类与嵌套规则
1、HTML元素分为三大类1)块状元素网页框架基本结构块:html、body、frameset、frame、noframe、iframe表单结构块:form、filedset、legend布局结构块:div段落结构块:p标题结构块:h1-h6列表结构块:ol、ul、dl、dt、dd、menu、dir居中结构块:center预定义结构块:pre引用结构块:blockqu原创 2018-01-29 09:21:52 · 383 阅读 · 0 评论 -
Web前端基础(三):网页布局与样式入门
1、网页开发流程(整体——>局部)1)分析各个模块,切图2)了解代码书写规范3)整体布局4)详细布局5)样式处理6)网页的优化和细节方面的处理2、如何开发网页1)div没有语义性,主要用于布局,独占一行显示 h标题标签; 列表:ul、ol、dl,里面的列:li; 段落:p;2)CSS层叠样式表,是一组格式设置规则,主要用于控制WEB页面的外原创 2018-01-26 16:36:27 · 4583 阅读 · 0 评论 -
Web前端基础(二):HTML5与网页入门
1. 网站布局DIV用于布局,Table用于显示数据,这是现在最基本的设计原则。1.1 Table 布局缺点:1、 Table主要呈现数据和处理数据,如果用于布局,使SEO优化(搜索引擎优化)较差;2、 不利于网站维护;3、 标签嵌套层级较多,代码冗余量较大。优点:1、 容易上手;2、 table在不同浏览器中都得到了很好的兼容;3、 可以形成复杂的变化,原创 2018-01-25 15:28:11 · 346 阅读 · 0 评论 -
Web前端基础(一):PhotoShop与图片认知
本文包含对前端开发中页面重构的理解、常用图片格式的认知、开发过程中图片选择、简要的PS技术等。1、页面重构就是“将美工图转换成html代码在WEB页面显示出来”,这一过程可以直接把PSD从PS里导出成网页;也可复杂到需要考虑页面中每个标签的使用,考虑“页面性能”。对于靠谱美工,美工图精确度约0px。对于不靠谱的美工,要与产品经理沟通,并用邮件往来。工作内容一般是“分析美工图—原创 2018-01-24 16:13:55 · 620 阅读 · 0 评论