wloe2gf 发表于 2024-6-30 10:54:11

css基本概念（语法和border调试法）


    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">css（层叠样式表）：<span style="color: black;">日前</span><span style="color: black;">运用</span>最广泛的版本为css2.1版本。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">层叠样式表：样式层叠，<span style="color: black;">选取</span>器层叠，文件层叠（使css更加灵活）</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">css语法：</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">语法1</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><span style="color: black;">选取</span>器{
      属性名;属性值;
      /* 注释 */
      }</div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">重视</span>点：</p>所有的符号都应该是英文的。<span style="color: black;">必定</span>要严格的区分<span style="color: black;">体积</span>写。任何问题写错了，都不会报错。（调试大法，常用的有border调试法。）<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">语法2 at语法</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;">@charest "UTF-8";
      @import url (2.css);
      @media (min-width:100px) and (max-width:200px){
      语法一
      } ；</div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">重视</span>点：</p>charest "UTF-8";声明字符编码。<span style="color: black;">必要</span>放在<span style="color: black;">第1</span>行import url (2.css) 告诉css引用一个<span style="color: black;">外边</span>样式第三句为媒介<span style="color: black;">查找</span>。两个@之间<span style="color: black;">必定</span>要用;隔离。<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">语法调试</p>W3c css validator （不<span style="color: black;">意见</span><span style="color: black;">运用</span>）vscode 颜色提醒webstorm 颜色提醒（<span style="color: black;">可靠</span>）<span style="color: black;">运用</span><span style="color: black;">研发</span>者<span style="color: black;">工具</span>border调试大法<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">border调试大法</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">过程</span>：</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">可疑</span>哪一个元素有问题就给这个元素加border。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">border效果未<span style="color: black;">显现</span>，则<span style="color: black;">暗示</span>这个<span style="color: black;">选取</span>器<span style="color: black;">或</span>语法有错误。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">border<span style="color: black;">显现</span>，则确认边界<span style="color: black;">是不是</span>符合预期。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">代码以及展示模式：</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic2.zhimg.com/80/v2-addfa56556b59b891909c443ae07c421_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>图1：错误的代码<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic4.zhimg.com/80/v2-6901ea8a7f94f1d3565c53c7dae66183_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>图2：border调试大法测试<span style="color: black;">选取</span>器<span style="color: black;">是不是</span>错误，<span style="color: black;">显现</span>则<span style="color: black;">选取</span>器<span style="color: black;">没</span>错。<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-3e10858d5bdd9f2f6cf29294d7bbe30e_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>图3：border调试法测试字体颜色未<span style="color: black;">显现</span>，则<span style="color: black;">表率</span>字体颜色<span style="color: black;">显现</span>错误。<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic2.zhimg.com/80/v2-564511d99e01512e72c8f34e63acaca1_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>图4：调试成功




j8typz 发表于 2024-11-5 04:39:26

谷歌外链发布 http://www.fok120.com/

j8typz 发表于 2024-11-6 00:11:39

我完全同意你的看法，期待我们能深入探讨这个问题。

7wu1wm0 发表于 2024-11-8 03:14:03

“BS”（鄙视的缩写）‌
页: [1]
查看完整版本: css基本概念（语法和border调试法）