一、标签语义化(重点):

1、可以方便代码的阅读和维护

2、同时让网络爬虫更好的解析从而更好的分析其内容

3、更好的优化引擎

如何做到标签语义化:个人理解是,首先,网页的HTML主要作用在网页的结构上面,W3C规范定义了很多标签,标签都具有它的意义,例如:<p>定义的是一个段落 <h1>~<h6>分别定义了标题的大小;这些一个一个的标签都有它的使用用途,根据相应的定义来使用它,使得我们能够有上图的一些结构方面语义化后带来的网页优势。

二、HTML和CSS:

HTML(超文本标记语言)是用于网页的结构,我们每个盒子里面的结构都有相应的标签组织而成,为了方便代码的阅读和维护,标签必须语义化。是网页的结构标准。

CSS(层叠样式表)是用于对网页样式的静态的修饰,是网页的表现标准。

我们通常使用CSS+div进行布局:div没有实际的语义

三、绝对路径和相对路径:

绝对路径例如:一个固定的网站:https://i.cnblogs.com/EditPosts.aspx?opt=1 或者 本地固定的文件路径C:\Users\zjf\Desktop\前端

相对路径:分为三个级  1、同级(和HTML文件同属一个文件夹) 2、下一级(在HTML文件的同属文件夹内的文件)  3、上一级 使用“../”(在HTML文件的上一级文件夹当中)

四、选择器:普通选择器1、*选择器 2、类选择器 3、id选择器  4、标签选择器

      符合选择器1、后代选择器  2、子代选择器   3、交集选择器“div.nav”  4、并集选择器使用“,”

HTML+CSS学习笔记整理的更多相关文章

  1. HTML+CSS学习笔记整理二

    盒子模型CSS(重点) 边框border     边框通常使用连写border:1px(边框大小) solid(实线或其他)  red(颜色) border-collapse:collapse (合并 ...

  2. htm5 css学习笔记整理

    点击链接后退页面: <a href="javascript:history.go(-1)">回到上一个网页</a> ——修改placeholder提示的样式 ...

  3. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  4. javaweb学习笔记整理补课

    javaweb学习笔记整理补课 * JavaWeb: * 使用Java语言开发基于互联网的项目 * 软件架构: 1. C/S: Client/Server 客户端/服务器端 * 在用户本地有一个客户端 ...

  5. python学习笔记整理——字典

    python学习笔记整理 数据结构--字典 无序的 {键:值} 对集合 用于查询的方法 len(d) Return the number of items in the dictionary d. 返 ...

  6. Deep Learning(深度学习)学习笔记整理系列之(五)

    Deep Learning(深度学习)学习笔记整理系列 zouxy09@qq.com http://blog.csdn.net/zouxy09 作者:Zouxy version 1.0 2013-04 ...

  7. HTML+CSS学习笔记 (7) - CSS样式基本知识

    HTML+CSS学习笔记 (7) - CSS样式基本知识 内联式css样式,直接写在现有的HTML标签中 CSS样式可以写在哪些地方呢?从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌 ...

  8. HTML+CSS学习笔记 (6) - 开始学习CSS

    HTML+CSS学习笔记 (6) - 开始学习CSS 认识CSS样式 CSS全称为"层叠样式表 (Cascading Style Sheets)",它主要是用于定义HTML内容在浏 ...

  9. HTML+CSS学习笔记(5)- 与浏览者交互,表单标签

    HTML+CSS学习笔记(5)- 与浏览者交互,表单标签 1.使用表单标签,与用户交互 网站怎样与用户进行交互?答案是使用HTML表单(form).表单是可以把浏览者输入的数据传送到服务器端,这样服务 ...

随机推荐

  1. SQL Server 使用union all查询多个条件数据合并分组显示,同比统计

    ),a.created_yearmonth,) created_yearmonth, a.countaccount countaccount, a.yxsl yxsl, a.sccdsl sccdsl ...

  2. jquery实现一些小动画二

    jquery实现一些小动画二 jquery实现拖拽功能 <!DOCTYPE html> <html lang="en"> <head> < ...

  3. Codeforces 1278F: Cards

    题目传送门:CF1278F. 题意简述: 有 \(n\) 个独立随机变量 \(x_i\),每个随机变量都有 \(p = 1/m\) 的概率取 \(1\),有 \((1-p)\) 的概率取 \(0\). ...

  4. 初识V4l2(二)-------浅析video_register_device

    在V4l2初识(一)中,我们已经知道当插上一个摄像头的时候,在uvc_driver.c中最终会调用函数video_register_device函数.接下来我们就简要分析这个函数做了哪些事情,揭开其神 ...

  5. c# 第10节 表达式

    本节内容: 1:表达式是什么 2:表达式实例 1:表达式是什么 2:表达式实例 3:运算符分类

  6. echars vue 封装全局组件 曲线 柱状图 同v-chars绿色系 配置样式

    Echars vue封装 ,曲线图 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  7. USACO wormhole

    洛谷 P1444 [USACO1.3]虫洞wormhole https://www.luogu.org/problemnew/show/P1444 JDOJ 2386: USACO 2013 Dec ...

  8. LG2530 「SHOI2001」化工厂装箱员 高维DP+记忆化搜索

    问题描述 LG2530 题解 设\(opt[i][a][b][c][d]\)代表装到第\(i\)个后,第\(1,2,3\)手上分别还剩\(a,b,c\)个的最小操作数. 记忆化搜索即可. 启示:如果状 ...

  9. VmWare下Ubuntu扩容问题

    出现问题:拉不动,扩展不了分区大小: 解决:首先在设置了里面扩大硬盘大小: 之后下载Gparted工具:gparted-live-0.8.0-5.iso(下载地址:https://pan.baidu. ...

  10. 使用教育邮箱免费申请JetBrains套装(IntelliJ, PhpStorm, WebStorm...)

    想下个PhpStorm来写php,发现可以使用教育账号白嫖. 申请步骤 打开 申请页面 ,点击 “APPLY NOW” 开始申请. 填写姓名,以及学校提供给你的邮箱(edu后缀邮箱,或.end.cn) ...