ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

HTML和css路线

2022-01-22 18:34:17  阅读:105  来源: 互联网

标签:定位 标签 元素 路线 HTML CSS 选择器 css


HTML、css详细路线

   目录


一、 HTML标签学习

1.排版标签

1.1标题标签

1.2段落标签

1.3换行标签

1.4水平线标签

2.文本格式化标签

3.媒体标签

3.1图片标签

3.2路径

3.3音频标签

3.4视频标签

4.链接标签

二、 列表标签

1.列表的应用场景

2.无序列表

3.有序列表

4.自定义列表

三、表格标签

1.表格的基本标签

2.表格相关属性

3.表格标题和表头单元格标签

4.表格的结构标签(了解)

5.合并单元格

三、 表单标签

1. input系列标签

2. button按钮标签

3.select下拉菜单标签

4.textarea文本域标签

5.label标签

四、 CSS基础学习

一、基础认知

1.css引入方式

内嵌式:CSS写在style标签中

外联式::CSS写在一个单独的.css文件中

行内式::CSS写在标签的style属性中

二、基础选择器

1.标签选择器

2.类选择器

3. id选择器

三、字体和文本样式

1.字体样式

2.文本样式

3. line-height行高

4. 颜色常见取值

五、 选择器进阶

1.复合选择器

2.并集选择器

4. Emmet语法(常用)

5. hover伪类选择器

六、 背景相关属性

1.背景颜色

2.背景图片

3.背景平铺

4.背景位置

5.背景相关属性连写

七、 元素显示模式

1、块级元素

2、行内元素

3、行内块元素

3、元素显示模式转换(常用)

4、HTML嵌套规范

八、 CSS三大特性

1、优先级的介绍

九、盒子模型

1.盒子模型的介绍

2内容区域的宽度和高度

3.边框( border )

4.内边距( padding )

5.CSS3盒模型(自动内减)

6. 外边距( margin)

7.清除内外边距

十、结构伪类选择器

十一、浮动

1.浮动的作用

2.清除浮动

十二、定位

1.设置定位方式

(1) 静态定位

(2) 相对定位

(3) 绝对定位

(4) 子绝父相

(5)定位底部半透明遮罩效果

(6)固定定位

2.元素的层级问题

3.装饰

(1)垂直对齐方式

(2)光标类型

(3)边框圆角

(4)overflow溢出部分显示效果

(5) 元素本身隐藏

(6) 元素整体透明度(了解)

(7)边框合并(了解)

(8)焦点伪类选择器

十三、CSS样式补充

1.精灵图

3.背景图片大小

3.文字阴影(了解)

4.盒子阴影(了解)

5.过渡

十四、项目前置认知

1.SEO三大标签

2.ico图标设置版心

3.版心设置

十五、字体图标、平面转换

标签:定位,标签,元素,路线,HTML,CSS,选择器,css
来源: https://blog.csdn.net/weixin_54546701/article/details/122641142

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有