html常用标签、包含关系、常用术语,以及网页设计中的字体分类
编程比较舒适的等宽字体:DejaVu Sans Mono
字体的分类:
serif (衬线字体){在笔画上面有些特殊的修饰效果}
sans-serif (非衬线字体){横平竖直.横就是横,点就是点}
monospace ( 等宽字体)
cursive ( 草书字体)
fantasy (虚幻字体)
以上这些分类都是一些大的分类, 并没有涉及具体的类型,如果将字体指定为这些格式,浏览器会自己选择指定类型的字体。一般情况在指定字体的时候.把分类名称放到最后面当备用字体
html标签
html标签的语义:
<div>,<span>没有任何默认样式和语义
<b>(加粗),<i>(斜体) 有默认样式 没有任何语义
<small> 有默认样式 h5中语义:用来表示一些细则,比如合同中的小字,版权声明等
<big>有默认样式 无语义 已淘汰
<cite>有默认样式 可以指明某内容的引用或参考,例如文章,图书,电影,标题,书名 例:<p><cite>《七龙珠》</cite>讲的是....<p>
<q>(行内引用)表示一个短的引用 例如 <p>孔子曰:<q>学而时习之</q></p> 有默认样式,浏览器会自动加一个引号
<blockquote>(块状引用)表示一个长的引用 例如 <p>孔子曰:<blockquote>学而时习之</blockquote></p> 有默认样式,浏览器会自动加一个引号
<sup>设置上标 比如 2<sup>2</sup> 则浏览器会显示2的2次方 或者可以加个a标签作为小备注
<sub>设置下标
<del>删除线
<ins> 表示插入的内容 浏览器会自动加上下划线
<pre>预格式标签 常用语代码的显示
<code> 仅仅语义表示这里面是一段代码,但是格式并不会保留.所以通常与 pre标签配合使用
ul,li无序列表
ol,li有序列表
dl,dd,dt 定义列表
注意:
一般情况下只会使用块元素包裹行内元素,而不会用行内元素包裹块元素
a 标签可以包裹任意元素,除了它本身(无论是块元素还是行内元素)
p元素不能包含其他的任何块元素
元素与元素之间的关系:
元素与元素之间的关系:
父元素:直接包含子元素的元素
子元素:直接被父元素包含的元素
祖先元素:直接或间接包含后台元素的元素(父元素也属于祖元素)
后台元素:直接或间接被祖元素包含的元素(子元素也是后台元素)
兄弟元素:拥有相同父元素的元素叫做兄弟元素
什么是伪类:
伪类专门用来表示元素的一种特殊的状态
比如 访问过的超链接,焦点文本框
什么是伪元素
伪元素用来表示元素中的一些特殊的位置
html中em单位是什么意思
和百分比类似,它是相对于当前元素的字体大小来计算的.1em=1个font-size
原文地址:http://www.qingzhouquanzi.com/100.html
笔记来源于 b站 尚硅谷 html5课程103集
html常用标签、包含关系、常用术语,以及网页设计中的字体分类的更多相关文章
- Photoshop在网页设计中的应用与方法
1.图像局部截取和图像尺寸调整 做网页设计时经常要用到的某张图像一部分,这就需要截取图像的局部.图像局部截取的方法很多,但使用Photoshop操作起来更方便.具体操作步骤如下: (1)在Photos ...
- <转载>网页设计中的F式布局
地址:http://www.uisdc.com/understanding-the-f-layout-in-web-design 网页设计中的F式布局 今天我们来重点介绍网页设计中的F式布局.传统的布 ...
- 网页设计中11 款最好CSS框架
网页设计和发展领域已经成为竞争激烈的虚拟世界.想要在网络的虚拟世界中生存,仅有一堆静止的在线网络应用是远远不够的,网页必须要有很多功能,配以让人无法抗拒的设计.网页编码一定要合适.精确,才能保证不发生 ...
- 网页设计中常用的19个Web安全字体
来自http://www.jb51.net 在Web编码中,CSS默认应用的Web字体是有限的,虽然在新版本的CSS3,我们可以通过新增的@font-face属性来引入特殊的浏览器加载字体.但多数情况 ...
- 网页设计中常用的Web安全字体
但多数情况下,考虑各个因素的影响我们还是在尽量充分利用这些默认调用的字体实现CSS的编写,这里整理了19个Web安全字体,让你无需任何顾虑的情况下畅快使用. 1, Arial 微软公司的网页核心字体 ...
- 详解CSS网页布局中默认字体样式
浏览器默认的样式往往在不同的浏览器.不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏 ...
- 教你避雷!网页设计中常见的17个UI设计错误集锦(附赠设计技巧)
以下内容由摹客团队翻译整理,仅供学习交流,摹客iDoc是支持智能标注和切图的产品协作设计神器. 精心设计的用户界面对网站意义重大.具备所有最新功能和响应式设计有助于提高网站的搜索引擎排名,从而增加受众 ...
- WEB安全字体(Web Safe Fonts)-网页设计用什么字体兼容性好?
效果:http://sandbox.runjs.cn/show/qgdljvh4 1 Arial微软公司的网页核心字体之一,最常用的sans serif字体,当字号很小时不容易阅读.但是,大写的“I” ...
- HTML网页设计中 link 和 @import 的区别
页面中使用CSS的方式主要有3种:行内添加定义style属性值,页面头部内嵌调用和外面链接调用,其中外面引用有两种:link和@import.外部引用CSS两种方式link和@import的方式分别是 ...
随机推荐
- SpringCloud 入门知识篇
SpringCloud 入门 springcloud 学习 7天学会springcloud 教程 https://www.cnblogs.com/skyblog/category/738524.htm ...
- Oracle使用正则表达式拆分字段里多行分布式值
不规范的表设计往往会带来程序设计上的麻烦,也会降低SQL的性能. 例如下表显示的内容: 这样我们调取多值字段用来做匹配的话就比较麻烦,我们可以通过正则表达式REGEXP_SUBSTR先将 多值得列分成 ...
- java中的过滤器 --Filter
package filter; import java.io.IOException; import javax.servlet.Filter; import javax.servlet.Filter ...
- Centos7系统备份与恢复教程
原文地址:https://www.cnblogs.com/fang888/p/8473485.html Centos系统备份与恢复教程 tar: 特点 1.保留权限 2.适合备份整个目录 3.可以选择 ...
- $_SERVER 中HTTP_HOST 和 SERVER_NAME
本来打算获取当前页面的url的 拼接时发现 $_SERVER['SERVER_NAME'] 并不是当前的url链接 打印整个$_SERVER 发现 [SERVER_NAME] => lvs ...
- shell脚本之结构化命令if...then...fi
if的用法日常主要用于数值或者字符串的比较来实现结构化的,模拟人脑,就是如果遇到什么事情,我们应该做什么 语法格式分为 1. if command;then command;fi (如果if满足 ...
- Microsoft:Team Foundation Server 20XX Release Notes
ylbtech-Microsoft:Team Foundation Server 2017 Release Notes 1.返回顶部 1. https://docs.microsoft.com/en- ...
- hashMap与 hashTable , ArrayList与linkedList 的区别(详细)
ArrayList 采用的是数组形式来保存对象的,这种方式将对象放在连续的位置中,所以最大的缺点就是插入删除时非常麻烦LinkedList 采用的将对象存放在独立的空间中,而且在每个空间中还保存下一个 ...
- lua源码学习篇四:字节码指令
在llimits.h文件中定义了指令的类型.其实就是32个字节. typedef lu_int32 Instruction; 上节说到变量最终会存入proto的数组k中,返回的索引放在expdesc ...
- 快速入门分布式消息队列之 RabbitMQ(2)
目录 目录 前文列表 RabbitMQ 的特性 Message Acknowledgment 消息应答 Prefetch Count 预取数 RPC 远程过程调用 vhost 虚拟主机 插件系统 最后 ...