这是我参与「第四届青训营 」笔记创作活动的的第1天 为了简单快速地掌握一些基础知识,结合在其他网站的学习了解,对其进行了一系列的整理
<head> <!--头部标签-->
<meta charset="utf-8" /> <!--编码规范,删除会乱码-->
<title>第一节课|青训营前端基础</title> <!--标题标签:网页名字-->
</head>
<body> <!--主体内容:网页内容-->
<!--div标签:容器,把页面内容打组、分模块进行页面排版
align=“改变内容显示的位置”:
left居左对齐(默认! ) /center居中对齐/right居右对齐"-->
<div align="left">
<!--1.文章题目:H标题标签<hl></hl>...<h6></h6>h1一级标签最大,h6六级标签最小,逐级递减!-->
<h1>标题</h1>
<h2>标题</h2>
<h3>标题</h3>
<h4>标题</h4>
<h5>标题</h5>
<h6>标题</h6>
<!--段落标签:<p></p>-->
<p>第一节课</p>
<p>第二节课</P>
<p>第三节课</p>
<!--图片标签:<img/ >属性名=“属性值” 标签名和属性之间需要空格隔开,属性和属性之间空格隔开 src="图片的位器"
width="图片的宽度"
height=""图片的高度"
-->
<img src="img/picture.jpg" width="200px" height="300px" />
<!--换行:<br />-->
<br /><br />
<ol>
<li>文字1</li>
<li>文字2</li>
<li>文字3</li>
</ol>
<!--2.无序列表:默认首位加个•,不分顺序
实例:<ul> <li>文字</li> </ul>-->
<ul>
<li>文字A</li>
<li>文字B</li>
<li>文字C</li>
</ul>
<!--3.自定义列表:对事物进行描述
实例:<dl>
<dt>事物</dt>
<dd>描述</dd>
</dl>-->
<dl>
<dt>事物A:</dt>
<dd>描述XXX</dd>
<dt>事物B:</dt>
<dd>描述XXX</dd>
</dl>
<!--4.超链接标签:<a></a> href=""网址链接"-->
<!--文字的连接-->
<a href="http://www.baidu.com">青训营前端基础</a>
<br /><br />
<!--图片的连接-->
<a href="http://www.baidu.com">
<img src="img/picture.jpg" width="100px" height="100px" />
</a>
</body>
以上是对网页设计的一些小知识点,还有一部分下一章继续总结