zoukankan      html  css  js  c++  java
  • HTML基础(1)

    1.前端开发语言介绍

    HTML(Hypertext Markup Language)—— 结构—— 超文本标记语言

    CSS(Cascading Style Sheets)—— 样式—— 层叠样式表

    JS(javascript)—— 行为—— 客户端脚本语言

    2.样式表出现的位置

    行间样式表:<div style="……"></div>

    内部样式表:<style>…………</style>

    外部样式表:<link href="style.css" rel="stylesheet"/>

    3.注释

    <!-- html 注释 -->

    /* css 注释 */

    注意有空格

    4.样式详解

    属性:属性值;

    width 宽度

    height 高度

    复合样式一:background 背景

          background-color 背景颜色

          background-image 背景图像

          background-repeat 背景图是否重复

          background-attachment 背景图是否固定

          background-position 背景图显示的位置

    复合样式二:border 边框

          border-width 边框宽度

          border-style 边框样式

          border-color 边框颜色

          边框样式:

            solid 实线

            dashed 虚线

            dotted 点线(IE6不兼容)

    复合样式三:padding 内边距

          padding-top 上边内边距

          padding-right 右边内边距

          padding-bottom 下边内边距

          padding-left 左边内边距

          padding: top right bottom left;

         注意:内边距相当于给一个盒子加了填充厚度会影响盒子大小。

    复合样式四:margin 外边距

           外边距的问题:1、上下外边距会叠压;

                    2、父子级包含的时候子级的margin会传递给父级;(内边距替代外边距)

           外边距复合:margin: top right bottom left;

    5.盒模型(标准)

    盒子大小 = border + padding + width/height

    盒子宽度 = 左border+左padding+width+右padding +右border

    盒子高度 = 上border+上padding+height+下padding+下border

    6.常见样式 — 文本设置

    font-size 文字大小(一般均为偶数)

    font-family 字体(中文默认宋体)

    color 文字颜色(英文、rgb、十六位进制色彩值)

    line-height 行高

    text-align 文本对齐方式

    text-indent 首行缩进(em缩进字符,1em=[font-size] 相当于1个字)

    font-weight 文字着重

    font-style 文字倾斜

    text-decoration 文本修饰

    letter-spacing 字母间距

    word-spacing 单词间距(以空格为解析单位)

  • 相关阅读:
    Linux Xshell常用命令(项目部署)
    返回的数据转换成百分比分的方法
    百度分享插件
    vue请求中 post get传参方式是不同的哦
    Axios 中文使用
    关于iview ui的"Page分页"组件的使用
    Vue 实现前进刷新,后退不刷新的效果
    Vue框架Element UI教程-axios请求数据
    Spring学习总结(8)-接口多个实现类的动态调用
    Redis集群
  • 原文地址:https://www.cnblogs.com/xiao-jie/p/3455666.html
Copyright © 2011-2022 走看看