首页 前端知识 网页设计:第一部分HTML

网页设计:第一部分HTML

2024-10-30 20:10:53 前端知识 前端哥 471 567 我要收藏

2024.10.21   今天练习了文本和各种标签

标题标签:<title>用于显示菜单地址栏的标题

                  <h1>、<h2>.....<h6>标题用于文本中,大小逐渐变小

段落标签:<p>  默认每个段落前没有缩进

         换行标签:<br/>

文本标签: 粗体:<strong>、<b>

                   斜体:<em>(常用)<i>、<cite>

                   上标:<sup>

                   下标:<sub>

                   中划线:<s>

                   下划线:<u>

水平线标签:<hr/>

div标签:划分区域

特殊符号:&nbsp(空格)  一个汉字大约占三个空格

245436297731416aa2e84aef21767d5e.png

00a159c0d6c645f68bff4af99ce4cf72.png

2024.10.22   今天练习了列表和表格

有序列表:<ol>     <ol   type="属性">

             属性:1,a,A,i,l

无序列表:<ul>     <ul    type="属性">

             属性:cicle,disc,square

定义列表:<dl>

               定义名词:<dt>

               定义解释:<dd>71e55189a9f5412bbcac9c3a95b337aa.png

b252badba9d64fca8a0b0d832b8f5c05.png

     --------------------------------------------------------------------

<table>:表示表格

      <tr>:table row    表示行

      <td>:table data cell    单元格

      <th>:table header cell  表头单元格

      <caption>:表格标题

      <thead>、<tbody>、<tfoot>:无实际意义,表逻辑

      <td   rowspan="数字">:合并行

      <td   colspan="数字">:合并列       (colmn  列)

741a98672a3041459b9cb2ae5dc53722.png6c775297accb41cca26cb4c37c75204e.png

3ed4221989f0408c8bd91ed2b6443235.png

2024.10.26    今天练习了图片和超链接

图片标签:<img  src=" 图片路径"  alt="图片无法显示时显示的文字"  title="鼠标放到上面时显示的文字">

scr 和 alt 是必选属性,一定要添加。title 是可选属性,可加可不加

在实际开发中,不论是图片还是超链接,一般使用相对路径,几乎不会使用绝对路径

图片的格式分为  位图和矢量图

位图:放大或缩小会失真

               jpg(或jpeg):不支持保存透明背景,适合颜色丰富的图片

               png:,支持保存透明背景,可以无损压缩,但不适合颜色丰富的图片

               gif:图片效果差,但适合制作动画

矢量图:放大缩小不会失真。

               .swf(常见,指Flash动画)  /  .ai  /  .cdr  /  .fh

超链接标签:<a  href="链接地址">文本或图片</a>

        target属性:<a href="链接地址"   target="打开方式"></a>

                打开方式:_self----在原来窗口打开(默认)

                                  _blank-----在新窗口打开 

内部链接:与图片中相对路径意思相同

锚点链接:快速导航

        

2024.10.27   今天练习了表单和框架

表单标签:form、input、textarea、select、option

form标签:<form>.....</form>  

        name(表单名称)、method(提交方式)、action(提交地址)、target(打开方式)、enctype(编码方式)

        name:  <form  name="xxx"></form>

        method:  get/post(安全性好)        <form method="post"></form>

        action: <form action="index.php"></form>

        target:  <form  target="_blank"></form>

        enctype:用于指定表单提交的编码方式 

input标签:<input type="表单类型"/>   (是自闭和标签)

        表单类型:

                        text:单行文本框

                        password:密码文本框

                        radio:单选框

                        checkbox:多选框

                        button或submit或reset:按钮

                        file:文件上传

textarea标签:<textarea   row="行数"   cols="列数"   value="取值">默认内容</textarea>

下拉列表:(select、option)

        select中:multiple表示可以选择多项

                        size列表的显示个数

        option中:selected表默认选择

                        value配合javaScript

iframe标签:<iframe src="链接地址"  width="宽度"  height="高度"></frame>

转载请注明出处或者链接地址:https://www.qianduange.cn//article/19615.html
标签
评论
发布的文章
大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!