Web01:HTML学习!

开头:别刻意的去记什么标签,只要常用的话,早晚会记下来的!

1.标题标签:<h1>~<h5>

<!--标题注释-->

<h1>标题标签1</h1>
<h2>标题标签2</h2>
<h3>标题标签3</h3>
<h4>标题标签4</h4>
<h5>标题标签5</h5>
<h6>标题标签6</h6>

2.段落标签:<p>

<p> 按林语堂的说dafsdffdfdfdsfdsfdjsfhdsjkfdsbjvbkjfhdjfndkvbdsjkafbdajvbkjdafndjbjvknajdbkkfbdklhjdbvdkjabjdkvbkjbakjfbdkjvbjkabfdkjanvjbkabvjkasvbjksdbvkjbskjd法,一切婚姻都像赌博,<p>都像在茫茫大海里行船。苏轼与王弗也不例外,婚姻的幸福不可预测。一切都是天定,苏轼能做的只能是等待。他就像神话里的王子,渴望爱情临空降临。</p>娘王弗则只是希望从此能够好好儿做苏家的女人。这几乎是很长一段时间里所有中国女人的心愿。王弗也渴望爱情,但她更渴望平平安安地做一个女人。她是知书达理的闺中贤媛,自然明了社会赋予她的重任是相夫教子而非风花雪月。她知道应该让苏轼感激,使苏轼满意,但是不该叫苏轼浪漫。王弗把自己的婚姻包装得很标准,她自己也准备成为一个理性主义者。不过她所嫁的苏轼偏偏是一个天生乐天派,一个月夜徘徊者,一个以爱情为食的美食家。于是一个大众化的妻子,一个卓尔不群的丈夫,在婚姻的黑森林里不和谐地匹配。巨大的反差,注定了这桩平常婚姻的不寻常。</p>
<!--下划线-->
<hr />

运行以上代码即可看出,在</p>之后便会换行.

3.文本标签

                <font color="#FF0001" size="1">自学可太棒了</font><br />
		<font color="antiquewhite" size="3">自学</font><br />
		<font color="bisque" size="5">自学</font><br />
		<font color="aqua" size="10">自学</font><br />
		<font color="aqua" size="40" face="宋体">自学</font>

其实就是调节字体显示的大小颜色等等的.标签里的常用属性:color,size,face,其实字体的大小,一般使用style来调整

4.img标签

                <!--注意src路径   本级目录用./  再上级用../-->
		<img alt="图片提示信息" src="../../img/logo2.png" width="60" height="60" />

常用的属性src,alt.注意src的路径问题

5.列表标签

                <!--有序:其实就是前边的标记是不是像数字这样是有序的-->
		<ol type=" 1" reversed="reversed">
			<li>你好</li>
			<li>我好</li>
			<li>他好</li>
			<li>大家好</li>
		</ol>
		<!--无序:其实就是前边的标记是不是像数字这样是有序的-->
		<ul type="square">
			<li>你好</li>
			<li>我好</li>
			<li>他好</li>
			<li>大家好</li>
		</ul>

常用的属性type,reversed.

6.超链接标签

                <a href="https://www.baidu.com/" >百度一下</a>
		<a href="#">不跳转</a>
		<a href="./003文本标签.html">跳转到003文本标签.html</a>
		<!--target控制网页通过什么方式打开-->
		<a href="http://www.baidu.com/" target="_blank">百度一下,使用新页面打开</a>

7.表格标签

<table border="1px" width="150px"  height="150px" align="center"                         bgcolor="aquamarine" cellspacing="0"  >
			<tr>
				<td colspan="2">苹果1</td>
				<td><font size="10">苹果2</font></td>
			</tr>
			<tr>
				<td rowspan="2">华为1</td>
				<td>华为2</td>
				<td>华为3</td>
			</tr>
			<tr>
				
				<td>三星2</td>
				<td>三星3</td>
			</tr>
		</table>

注意table里的属性cellspacing、cellpadding和border,如果想看一下table的边框请在table里使用style属性:

style="border: solid 1px red;"   其中width也可以使用100%这种的百分数来伸缩

总结:其实HTML的众多标签用的不太多,当然这只是我本人现在学习到的程度的个人感觉。而且后来使用了框架比如bootStrap,这是一个设计界面的框架吧,我们要敲的代码就少多了。我们对HTML能了解还是了解。

猜你喜欢

转载自blog.csdn.net/qq_38827988/article/details/88026177