常用标签
<a href="">链接,包含4个伪类link/visited/hover/active</a>
<span>用于区分样式</span>
<header>
header主要用于页面头部信息介绍,也可用于板块头部
</header>
<nav>
导航:包含链接的一个列表
</nav>
<nav><a href="">链接1</a><a href="">链接2</a></nav>
<footer>
页脚,和header对应,页面或板块底部
</footer>
<section>
板块:页面上的板块,划分页面上不同区域、划分文章里的不同节
先用section,再用div
</section>
<article>
article,页面中用于表示一套 结构完整且内容独立的部分,好比帖子的主体
</article>
<aside>
aside,与当前页面或主要内容相关的引用,侧边栏,广告,nav元素组等
</aside>
<time>
time,表示时间或日期
</time>
参考:w3school.com.cn/tags/index.asp
其他常用标签
<h1>logo,页面唯一</h1>
<h6>6级标题</h6>
<p>段落</p>
<strong>加粗强调</strong>
<em>斜体强调</em>
<ul>
无序列表及列表项
<li>苹果</li>
<li>梨子</li>
</ul>
<ol>
有序列表及列表项
<li>脱裤子</li>
<li>放屁</li>
</ol>
<dl>
自定义列表dl及列表项表头dt及列表项信息dd
<dt>name</dt>
<dd>jirk</dd>
<dd>jim</dd>
</dl>
<mark>标记</mark>
标记有黄色背景
<img src="../210908Psd图/999.png" alt="">
img标签,图片
标签样式初始化
css reset 原则:浏览器的默认样式都别使用,因为不同浏览器不一致
<ul>
<li></li>
<li></li>
</ul>
<ol>
<li></li>
<li></li>
</ol>
检查-找到节点-user agent stylesheet中写的便是节点的默认样式
css reset,先将所有元素的样式清除,再分别定义
需要重置的样式:
1与盒模型相关的
border/margin/padding
2元素特有的样式
ul>li ol>li a img
建议或规范:清除用到的标签的默认样式,不能一刀切;②不要忘了body
css-reset
<style>
body, h1, h2, h3, h4, h5, h6, p, dl, dd{
margin: 0;
}
ul, ol{
margin: 0; padding: 0; list-style: none;
}
img{
border: none; vertical-align: top;
}
a{text-decoration: none;}
</style>