HTML中的常见标签

标题标签 h1~h6

段落标签 p

无序列表 <ul>

<li></li>

</ul>

有序列表 将ul换成ol

<b> <strong>对字体有加粗效果 但是strong有语义性 表示强调

<i> <em>对字体有斜体效果 em语义性 表强调

语义化标签只对浏览器和搜索引擎有意义,

对于普通用户无差别

语义化标签只是为这些特定名称的标签的盒子

增加了一些初始样式,本质依然是一个普通的标签的盒子

合理使用语义化标签,可以让HTML文档对于浏览器和搜索

引擎更友好,方便做SEO,不同的浏览器对于语义化标签

的初始默认样式解析会存在一定的差异,所以为了保证一套

界面在所有浏览器是上显示效果一致,需要对该页面中用到

的语义化标签进行样式初始化称为CSSReset list-style

margin padding line-height

样式初始化时:严禁使用通配符选择器,因为通配符选择器会使网站加载速度变的非常慢

超链接:发起网络请求(进行页面的跳转)

<!-- target:_self; 当前页面 _blank 新页面-->

<a href="http://www.baidu.com" target="_self">百度一下</a>

<!-- 跳转到本文档的指定位置 指定文档超出可视区域才可以跳转 --> 例如给想要跳转到部分加一个id为h1

<a href="#h1">回到顶部</a>

图片处理的时候一般只给宽度,不给高度,让图片自适应

cover让图片适应框的大小,等比缩放 图片可能显示不全 在移动端可以用, 在IE9以下不支持

contain 不能占满整个框,图片会显示全

object-fit:cover;

/*毛玻璃效果*/

filter: blur(10px);