3.16 html

 HTML语言:超文本标记语言(Hyper TextMarkup Language)

基础语法:分为单标签,双标签,和注释语法。

                 单标签写法:<标签名>或者<标签名/>

                 双标签写法:<标签名></标签名>

                 注释语法:<!--内容-->

基本结构:  

1
2
3
4
<html>
    <head></head>头部:控制作用(页面的布局、效果)
    <body></body>主体:放内容(文字、图片等)
</html>

常用标签:格式控制类

1
2
3
4
5
<body bgcolor:"颜色" text:"颜色" bgground:"图片"><br>   bgcolor会改变整个页面的颜色,text是给body里的变颜色,bgground背景图片。 <br>  <font color="#9900FF" size="7" face="华文行楷">这是字体标记</font>  (body里字体大小最大是7号)
  <b>加粗</b><br>  <strong>加粗2</strong><br>  <i>倾斜</i><br>  <em>倾斜2</em><br>  <u>下划线</u>
  <b><i><u>可以相互嵌套<br>  &nbsp空格  <br/>换行<br>  <h1>标题1</h1><br>  <h6>标题6</h6>
 
</body>

     字体效果图加粗倾斜下划线效果图标题1和6效果图,越来越小

1
<p></p>段落,P与P之间有换行的空间层标签:<span></span>内容有多少大小就是多少,紧挨着没有换行空间<div></div>默认占一行
1
2
3
4
5
6
7
8
9
10
<ol type="I">(有序列表)
      <li>北京</li>
      <li>上海</li>
      <li>深圳</li>
</ol>
<ul type="circle">       (无序列表)  type类型:circle空心圆,disc实心圆,square方块
        <li>北京</li>
        <li>上海</li>
        <li>深圳</li>
 </ul>

  空心圆效果图实心圆效果图方块效果图

1
<a href="无标题.png">内容</a> 能打开png,txt,html等,网址也可以,鼠标移动上去以后鼠标会变成小手。<br>超链接也可以做锚点到某个位置,做锚点<a name="h"><a>   回到锚点位置<a href="#a">回到</a>

超链接效果图

1
<img src="无标题.png" width="200" height="200" title="你好" alt="这是蛋糕图片"></img><br><img src></img>为插入图片,width是图片的宽,height是图片的高,title是鼠标放上去显示的内容,alt是图片加载不出来的时候显示的提示文字

title效果图alt效果图

图片做链接:

1
2
3
4
<a href="链接网址">
<img src="无标题.png">
 
</a>

表格:表格标签

1
2
cellspacing:单元格边距,单元格与单元格之间的距离
cellpadding:单元格间距,单元格与内容的距离

 

  

 

posted on   sunyexiang  阅读(104)  评论(0编辑  收藏  举报

编辑推荐:
· 智能桌面机器人:用.NET IoT库控制舵机并多方法播放表情
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
阅读排行:
· 手把手教你在本地部署DeepSeek R1,搭建web-ui ,建议收藏!
· 新年开篇:在本地部署DeepSeek大模型实现联网增强的AI应用
· Janus Pro:DeepSeek 开源革新,多模态 AI 的未来
· 互联网不景气了那就玩玩嵌入式吧,用纯.NET开发并制作一个智能桌面机器人(三):用.NET IoT库
· 【非技术】说说2024年我都干了些啥

导航

< 2025年1月 >
29 30 31 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31 1
2 3 4 5 6 7 8
点击右上角即可分享
微信分享提示