• 1109HTML学习


    <div>
    <!--face里面用逗号隔开表示 字体优先选择。size是字体1到7 -->
    <font color="red" face="微软雅黑,宋体" size="7">PHP的html学习</font>
    <!-- ul是无序列表 ol是有序列表(前面有排序)
    ul的type属性有三种,disc默认实心圆,circle空心圆,square方块。
    Ol的默认值为,1默认值为阿拉伯数值,a小写英文,A是大写英文,i小写英文,I是大写罗马序号-->
    <ul type="square">
    <li>这是一个列表项1</li>
    <li>这是一个列表项2</li>
    </ul>
    <ol type="a">
    <li>这是一个ol项</li>
    <li>这是一个ol项</li>
    </ol>
    <!-- noshade显示颜色为纯色,size厚度 -->
    <hr size="10" noshade="noshade" width="100%" align="center">
    <!--
    &gt >
    &lt <
    &quot ""
    &reg 注册商标符
    &copy 版权符
    &amp &符号
    -->
    <em>这是一个元素
    &gt ;
    &lt ;
    &quot ;
    &reg 注册商标符;
    &copy 版权符;
    &amp </em>

    </div>

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

    ./   当前目录。  ../上一级目录  ../../上一级目录的上一级目录  /当前根目录

    <frameset rows="30%,70%" >
    <frame src="./a.html" name="top" noresize="noresize" />
    <frameset cols="40%,*">
    <frame src="./b.html" name="left" noresize="noresize" />
    <frame src="./a.html" name="right" noresize="noresize" />
    </frameset>
    </frameset>
    <noframes>
    <body>
    <h1>您的浏览器不支持框架</h1>
    </body>
    </noframes>

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

    div+css 使网页表现与内容分离。
    文档头:HTML 1.0 Transitional (过渡类型) 比较宽容的一种类型。

    行内式:<h1 style="color:red;background:">...
    内置式:
    <style type="text/css">
    h1{
    color:red;
    }
    </style>
    导入式:
    <style type="text/css">
    @import"mystyle.css";
    </style>
    链接式:
    <link href="mystyle.css" ref="stylesheet" type="text/css">
    ---------------------------------------------------------------
    class .
    id #
    (交集选择器)div.special div#special
    并集选择器:p,h1{}
    后代选择器:p font{}
    * 代表所有

    css优先级:行内样式>ID样式>类别样式>标记样式
    ---------------------------------------------------------------
    介绍文字和图像的排版:
    css文字样式:
    准备网页:
    设置字体:
    文字大小:
    行高:
    文字颜色与背景颜色:
    文字加粗、倾斜与大小写
    文字的装饰效果:
    文字的水平对齐方式:
    文字布局:
    短路的垂直对齐方式:
    文本缩进:text-indent:px % cm 如果值是负数,则向左,-9999则是一种隐藏。
    文本对齐:text-align: left right justify (两端)
    色彩: color:#FFFFFF red rgb(0,0,255)
    字体:font-family Arial
    字体大小:font-size
    字体粗细: font-weight normal bold(700) bolder 比normal 粗 lighter比normal细
    字体修饰:text-decoration underline(下划线) line-through (删除线) overline (上划线)text-decoration="none"
    大小写: text-transform :capitalize uppercase lowercase
    行高: line-height 单行文本高度
    写在style里面。
    ----------------------------------------------------------
    css中背景的处理:
    背景固定:background-attachment scroll 背景随对象滚动,fixed背景固定。
    背景颜色:background-color
    背景图像:background-image :url(图片路径)
    背景定位:background-position top center bottom left center right -100px;-100px;
    背景重复:background-repeat no-repeat repeat-x repeat-y
    背景: background:url(../images/taotao.jpg) #990000 repeat-x 100px 50px; 横向重复
    (只要针对图片不能铺满整个屏幕)

    body{
    height:1000px;
    background-image:url();
    background-color:
    background-repeat:
    background-attachment:fixed
    }
    盒子模型: margin: Border: Padding:Content

    margin/padding 的简写:
    方法是按照规定的顺序,给出2个或者3个或者4个属性值,他们的含义是将有区别。
    如果给出2个属性值,前者表示上下边框的属性,后者表示左右边框的属性。
    如果给出3个属性值,前者表示上边框的属性,中间的数值表示左右边框的属性,后者表示下边框的属性。
    如果给出4个属性值,一次表示上、右、下、左边框的属性,即顺时针排序。

    边框: 属性:
    border-color:red green
    border-1px 2px 3px;
    border-style:dotted (点划线) dashed 虚线 solid (实线) double(双重线)
    border:1px solid #FF0000;

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

    css定位:
    position :static (默认) absolute relative fixed
    Static 没有特别设置 对z-index无效
    Absolute 使用left right top bottom 等属性相对于最接近的一个最有定位设置的父对象进行绝对定位。
    Relative 使用left right top bottom 父对象进行相对定位z-index
    width :100px
    hei ght:100px
    position:absolute
    left:5px;
    z-index:10px
    ----------------------------------------
    position 为fixed的时候,当浏览器为IE6的时候,浏览器失效。
    z-index块与块的层级关系。
    div在没有设置层级关系的时候,谁写在后面谁就在上面。
    例如:
    <div z-index="-9999~9999">数字越大,层级越大,越容易覆盖其他元素。设置成负数的时候要注意,可能会导致会导致表单无法点击,默认值为0

    list:
    ul属性。 list-style-type:disc circle square
    list-style-image:url();
    list-style-position:outside(默认情况) Inside.与前面序列号的绑定。

    css溢出:
    Overflow:
    hidden
    scroll
    auto
    visible:
    overflow-x overflow-y:

    兼容问题。IE6较为特殊。
    <!--[if !IE]><!-->除IE外都可识别<!--<![endif]>-->
    IETest来解决浏览器兼容工具。或者开发人员工具。debugBar

  • 相关阅读:
    System.Security.Cryptography.CryptographicException: 系统找不到指定的文件。
    AOP之三 Java平台研究
    c#中对"Crossthread operation not valid"错误的处理办法
    AOP之二 技术基础
    Fedora14安装Nvidia驱动的过程
    undefined reference问题总结
    深度解析VC中的消息传递机制
    DLL导出类方法
    VC++中把一个对话框最小化到托盘
    AOP之四 .Net平台研究
  • 原文地址:https://www.cnblogs.com/smartyman/p/4085141.html
Copyright © 2020-2023  润新知