![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
HTML5+CSS
文章平均质量分 89
煤气罐罐202
计科计科
展开
-
⑨品优购项目
1.品优购项目规划1.1网站制作流程1.2品优购项目整体介绍●项目名称:品优购●项目描述:品优购是一个电商网站,我们要完成PC端首页、列表页、注册页面的制作1.3品优购项目的学习目的电商类网站比较综合,里面需要大量的布局技术,包括布局方式、常见效果以及周边技术。品优购项目能复习、总结、提高基础班所学布局技术。写完品优购项目,能对实际开发中制作PC端页面流程有一个整体的感知。为后期学习移动端项目做铺垫。1.4开发工具以及技术栈1.开发工具VScode、Photoshop(fw)、原创 2021-10-26 14:32:44 · 1087 阅读 · 0 评论 -
⑧HTML5、CSS3提高
1. HTML5的新特性1.1 HTML5新增的语义化标签●< header> : 头部标签●< nav> :导航标签●< article> :内容标签●< section> : 定义文档某个区域●< aside> :侧边栏标签●< footer> :尾部标签注意:●这种语义化标准 主要是针对搜索引擎的●这些新标签页面中可以使用多次●在IE9中, 需要把这些元素转换为块级元素● 其实,我们移动端更喜欢使用这些标签原创 2021-10-20 16:36:16 · 100 阅读 · 0 评论 -
⑦CSS精灵图&字体图标&CSS三角&CSS用户界面样式&vertical-align属性应用&溢出文字省略号显示&常见布局技巧&CSS初始化
1.精灵图1.2精灵图的使用使用精灵图核心总结:1.精灵图主要针对于小的背景图片使用。2.主要借助于背景位置来实现–background-position。3. -般情况下精灵图都是负值。( 千万注意网页中的坐标: x轴右边走是正值,左边走是负值,y 轴同理。)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport"原创 2021-10-16 17:18:43 · 271 阅读 · 0 评论 -
CSS常见错误
1.冒号下面有红色的~,一般是因为它的前一行末尾的分号;是中文输入法。虽然不影响代码实现,但是看着很难受,所以还是改了好。错误代码:正确代码:持续更新…原创 2021-10-16 10:48:47 · 443 阅读 · 0 评论 -
⑥CSS定位
1.定位1.1为什么需要定位以上效果,标准流或浮动都无法快速实现,此时需要定位来实现。所以:1.浮动可以让多个块级盒子一行没有缝隙排列显示 ,经常用于横向排列盒子。2.定位则是可以让盒子自由的在某个盒子内移动位置或者固定屏幕中某个位置,并且可以压住其他盒子。1.2定位组成定位:将盒子定在某一个位置,所以定位也是在摆放盒子。按照定位的方式移动盒子。定位=定位模式+边偏移。定位模式用于指定一个元素在文档中的定位方式。 边偏移则决定了该元素的最终位置。1.2.1 定位模式定位模式决定元素的定原创 2021-10-15 20:45:03 · 120 阅读 · 0 评论 -
⑤CSS浮动&学成在线网实例
1.浮动( float)1.2标准流(普通流/文档流)所谓的标准流:就是标签按照规定好默认方式排列块级元索会独占一行,从上向下顺序排列。● 常用元素:div. hr、 p. h1~h6、 ul. ol. dl. form、 table行内元素会按照顺序,从左到右顺序排列,碰到父元索边缘则自动换行。● 常用元素: span. a、i. em等以上都是标准流布局, 我们前面学习的就是标准流,标准流是最基本的布局方式。这三种布局方式都是用来摆放盒子的,盒子摆放到合适位置,布局自然就完成了。注原创 2021-10-14 10:34:18 · 397 阅读 · 0 评论 -
④CSS盒子模型
1.盒子模型1.1看透网页布局的本质网页布局过程:1.先准备好相关的网页元索,网页元索基本都是盒子Box.2.利用CSS设置好盒子样式,然后摆放到相应位置。3.往盒子里面装内容.网页布局的核心本质:就是利用CSS摆盒子。1.2盒子模型( Box Model )组成所谓盒子模型: 就是把HTML页面中的布局元素看作是一个矩形的盒子 ,也就是一个盛装内容的容器。CSS盒子模型本质上是一个盒子,封装周围的HTML元素,它包括:边框、外边距、内边距、和实际内容1.3边框( border )b原创 2021-10-10 19:29:50 · 232 阅读 · 0 评论 -
③CSS三大特性
1. CSS的三大特性CSS有三个非常重要的三个特性:层叠性、继承性、优先级。1.1层叠性相同选择器给设置相同的样式,此时一个样式就会覆盖(层叠)另一个冲突的样式。层曼性主要解决样式冲突的问题层叠性原则:● 样式冲突 ,遵循的原则是就近原则,哪个样式离结构近,就执行哪个样式● 样式不冲突,不会层叠...原创 2021-10-09 15:24:21 · 85 阅读 · 0 评论 -
②css之Emmet语法、复合选择器、元素显示模式、背景图片
1.Emmet语法1.1快速生成HTML结构语法生成标签直接输入标签名按tab键即可比如div 然后tab键,就可以生成< div> </ div>如果想要生成多个相同标签加上就可以了比如div3 就可以快速生成3个div如果有父子级关系的标签,可以用 > 比如ul > li就可以了如果有兄弟关系的标签,用+就可以了比如div+p如果生成带有类名或者id名字的,直接写.demo, 或者#two tab 键就可以了如果生成的div类名是有顺序的,可以用自增符原创 2021-10-08 17:00:47 · 243 阅读 · 0 评论 -
①CSS3-选择器、文本
1.CSS简介HTML主要做结构,显示元素内容。CSS美化HTML,布局网页。CSS最大价值:由HTML专注去做结构呈现,样式交给CSS,即结构(HTML)与样式(CSS)相分离。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sca原创 2021-09-27 22:44:55 · 329 阅读 · 0 评论 -
HTML(下)
1.表格标签1.1表格的主要作用表格主要用于显示、展示数据。1.2表格的基本语法<table> <tr> ... </tr> ...</table>< table> < / table>是用于定义表格的标签。< tr > < / tr >标签用于定义表格中的行,必须嵌套在< table > < / table >标签中。< td> < /td&原创 2021-09-23 20:27:52 · 156 阅读 · 0 评论 -
HTML(上)
1.Web标准的构成主要包括结构、表现和行为三个方面。标准说明结构结构用于加粗样式网页元素进行整理和分类,现阶段主要学的是HTML表现表现用于设置网页元素的版式、颜色、大小等外观样式,主要指的是CSS行为行为是指网页模型的定义及交互的编写,现阶段主要学的是JavaScriptweb标准提出的最佳体验方案:结构、样式、行为相分离。2.HTML标签2.1基本语法HTML标签是由尖括号包围的关键词,例如**< html >**。HTML标签通常原创 2021-09-21 17:10:55 · 629 阅读 · 0 评论