首页 > 代码库 > h4和c2的简单内容

h4和c2的简单内容

从开始接触前端到现在也有好长一段时间了,仅个人而言写点对于h4和c2的知识点。

 

1.font

这是在html中比较重要的一个属性,

用法:<font  color=”gray”   size=”2”   face=”宋体” >内容</font>

                   color:让文字颜色改变

size:范围是1-7   正常3

face : 指定文本的字体

font-weight 设置具体的数字范围是100-900.

 

font的连写:

font:  font-style   font-weight  font-size   font-family;

特点:

font-style,font-weight 可以省略

font-style,font-weight 可以交换顺序

font-size   font-family 不可以省略

 

例如:font: 15px "华文行楷";

其中字体大小和字体体系是必写的

line-height:40px;

行高定义需要在字体定义之后,如果 行高在font之前 ,line-height失效!

 

2.粗体、斜体、下划线、删除线

标签

用法

效果

被弃用的相同效果

strong

<strong></strong>

加粗

b

em

<em></em>

斜体

i

ins

<ins></ins>

下划线

u

del

<del></del>

删除线

s

 

3.ol,ul,dl列表

ul无序列表:

    <ul>

                   <li>内  容</li>

                   <li>内  容</li>

          </ul>

ol有序列表

dl自定义列表:

         <dl>

                   <dt>小标题</dt>

                   <dd>内  容</dd>

         </dl>

其中,ul列表在以后的开发中是会经常使用的

 

4.table表格

<table>

         <caption>标题</caption>

         <thead><tr><th> 表头 </th></tr></thead>

      <tbody><tr><td> 内容 </td></tr></tbody>

         <tfoot><tr><td> 表尾 </td></tr></tfoot>

</table>

 

colspan="2"    rowspan

个人认为表格了解一下,能看懂即可,因为并不会有太多的需求使用到这类表格

 

5.超链接标签

target=”跳转的方式”

_blank     在新的窗口打开页面

_self        在当前页面跳转

使用a标签在页面上定位标签

要准备一个被a标签定位的标签,要有id属性

标签的href属性的值是#+目标标签的id

         实现下载功能

<a href=http://www.mamicode.com/”文件的相对路径” >

注意:

①这种方式当下已经很少使用

②如果浏览器认识这种文件,会直接在浏览器中打开

 

6.input输入框

<input type="text" placeholder="请输入用户名" value="http://www.mamicode.com/123456" />

属性:  placeholder   提示的文字,当我们输入内容的时候,会消失

 

maxlength       设置允许输入的最大长度

 

<form action="">

    <fieldset>    //给表单加个框框

        <legend>测试type属性     //框框上的字

        </legend>

        <label for="">color:

        </label>       

        <label for="">tel:

        </label>

        <input type="tel">

        <input type="submit">

    </fieldset>

</form>

这个属性也是特别重要的一个属性,因为在网页中我们能够点击去输入内容的文本框,80%都是input标签

 

7.定位

1.固定定位

  position :fixed 

特点:

  1      不占据原来在标准流里的位置

  2      模式转换

  3       定位的基准是以浏览器为基准的

 

2.绝对定位

  position:absolute

特点:

  1      不占据原来在标准流中的位置

  2       可是实现模式的转换

  3      如果父元素设置了定位,绝对定位是相对于父元素而言的,否则就是相对于浏览器而言

 

3.相对定位

  position: relative

特点:

  1      占据原来在标准流里的位置

  2      不能实现模式转换

  3      定位是相对于原来在标准流里的位置而言的

 

4.静态定位

  position: static        

静态定位其实就是标准流,也就是默认的情况

特点:

  1      占据原来的位置

  2      不能实现模式转换

  3      定位无论怎么设置,都没有效果

平时在使用的时候,要记住子绝父相,也就是给子元素绝对定位,那么就要给父元素相对定位,让子元素相对于父元素来设置定位的位置

 

8.层级

z-index:number

默认层级为0,最大为9999,当然这很少有人会这样去设置层级 。。

只有设置了定位的元素才能够使用层级这个属性,static定位是无法使用z-index的

控制的是定位里层级

 

写的不是很好,具体内容我认为还是要再实践中去探索

h4和c2的简单内容