zoukankan      html  css  js  c++  java
  • html和css入门1

    • 如果把网页想象成自己的房子,html文件就像墙体结构,将房子分为几个框架,区分哪个房子是客厅、食堂和卧室等等
    • css是房子的风格,墙体颜色 地板风格等等。
    • javascript文件是你的交互性组件,可以想象成电视遥控器或者车库门遥控开关,它们会让房子的某些元素发生变化。
    • 用chrome浏览器选择右上角三行的按钮,选择工具里的开发者工具可以看到页面的结构。
    •  一个box模型有Margin外边距,border边框,padding内边距和content内容这几个元素构成了网页上的边框
    • 内边框padding的作用是在content内容的周围清理出一片区域,该区域会采用方框的背景颜色,因此它也是方框内部空间的一部分来直接保护内容。
    • 边框border继承box的颜色属性。
    • margin没有颜色,完全透明。可以将其看作是两个boxes之间的空白。
    • 整个box的实际显示度是(border宽+内边距宽)*2+内容宽度。这些值哪一个发生了变化时都需要重新计算。

    定义边框宽度:

    * {
    outline: 1px solid red !important;
    }
    * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    }

    .image {      //这是链接到html文件当中的image这一个类,定义image这个类的样式
    max- 460px;
    }
    .description {
    max- 705px;
    }

    定位元素是css中最复杂的概念之一,弹性方框布局flexible box layout是一个强大的工具,是一个弹性的方框,可以高效地在容器或者idv内布局。

    如果要将两个元素并排放置,则要把父级容器的显示属性改为flex

    例如这个父级div是app类,子级是image和description.

    要在页面中插入图片 无比要把图片存储到页面能够访问的位置。

    响应式网页:会随着网页窗口的大小自动调整大小。

    设计响应式的网页就不能将列宽设为固定的像素,而是使用百分比。

  • 相关阅读:
    # 牛客挑战赛46_C题排列(前缀优化DP)
    # 牛客挑战赛46 B最小的指数
    Educational Codeforces Round 99 (Rated for Div. 2)
    Wireless Password HDU
    Codeforces Round #686 (Div. 3)
    网络流之最小费最大流
    网络流之最大流
    next()和nextLine()的区别
    初识HTML
    jQuery笔记
  • 原文地址:https://www.cnblogs.com/Yiren-33/p/6654487.html
Copyright © 2011-2022 走看看