CSS 学习三
<h2 id="css-学习三">CSS 学习三</h2><p>继续</p>
<h3 id="css-fonts">CSS Fonts</h3>
<ul>
<li>
<p><code>font-family</code>：指定字体</p>
</li>
<li>
<p><code>font-size</code>：字体大小</p>
</li>
<li>
<p><code>font-style</code>：字体样式</p>
<ul>
<li><code>normal</code>：默认值</li>
<li><code>italic</code>：斜体</li>
<li><code>oblique</code>：斜体</li>
<li><code>inherit</code>：继承父元素</li>
</ul>
</li>
<li>
<p><code>font-variant</code>：将小写字母转为大写，但是字体尺寸更小</p>
<ul>
<li><code>normal</code>：默认值，不做任何样式调整</li>
<li><code>small-caps</code>：小型大写字母的字体</li>
<li><code>inherit</code>：继承父元素</li>
</ul>
</li>
<li>
<p><code>font-weight</code>：字体的粗细</p>
<ul>
<li><code>normal</code>：默认</li>
<li><code>bold</code>：粗体</li>
<li><code>bloder</code>：更粗的粗体</li>
<li><code>lighter</code>：更细的字体</li>
<li><code>数字</code>：400等于normal，700等于bold</li>
<li><code>inherit</code>：继承父元素</li>
</ul>
</li>
</ul>
<h3 id="css-link">CSS Link</h3>
<ul>
<li><code>a:link</code>：未访问链接</li>
<li><code>a:visited</code>：已访问链接</li>
<li><code>a:hover</code>：鼠标移动到链接上</li>
<li><code>a:active</code>：鼠标点击时</li>
</ul>
<h3 id="css-列表">CSS 列表</h3>
<ul>
<li><code>list-style-image</code>：将图像设置为列表标志</li>
<li><code>list-style-position</code>：标志位置
<ul>
<li><code>outside</code>：放置在文本以内，并环绕文本对齐</li>
<li><code>inside</code>：放置文本左侧（默认），列表项目标记放置在文本以外，且环绕文本不根据标记对齐</li>
<li><code>inherit</code>：继承父元素</li>
</ul>
</li>
</ul>
<h3 id="盒子模型">盒子模型</h3>
<p>封装周围的HTML元素，包括边距、边框、填充和内容</p>
<ul>
<li><code>Margin</code>：外边距，透明，用以清除边框外的区域</li>
<li><code>Boder</code>：边框</li>
<li><code>Padding</code>：内边距，透明，用以清除内容周围的区域</li>
<li><code>Content</code>：内容</li>
</ul>
<h3 id="css-border">CSS Border</h3>
<ul>
<li>
<p><code>boder-style</code>：设置四个边框的样式</p>
<ul>
<li><code>none</code>：无边框，优先级最低，如果存在重叠边框，会显示为其他边框</li>
<li><code>hidden</code>：无边框，优先级最高，如果存在重叠边框，则不显示边框</li>
<li><code>dotted</code>：点状</li>
<li><code>dashed</code>：虚线</li>
<li><code>solid</code>：实线</li>
<li><code>double</code>：双实线</li>
<li><code>groove</code>：3D凹槽</li>
<li><code>ridge</code>：3D垄状</li>
<li><code>inset</code>：陷入</li>
<li><code>ouset</code>：突出</li>
<li><code>inherit</code>：继承父元素</li>
</ul>
</li>
<li>
<p><code>border-width</code>：设置四个边框的宽度</p>
<ul>
<li><code>thin</code>：细边框</li>
<li><code>medium</code>：中等边框（默认）</li>
<li><code>thick</code>：粗边框</li>
<li><code>length</code>：自定义值</li>
<li><code>inherit</code>：继承父元素</li>
</ul>
</li>
<li>
<p><code>boder-color</code>：设置四个边框颜色</p>
<ul>
<li><code>color</code>：指定颜色</li>
<li><code>transparent</code>：透明（默认）</li>
<li><code>inherit</code>：继承父元素</li>
</ul>
</li>
<li>
<p><code>border-radius</code>：外边框圆角</p>
</li>
</ul>
<p>瑞了瑞了，满脑子英文单词</p>
<h3 id="美则美矣未尽善焉">美则美矣，未尽善焉😕😕😕</h3>
<p><strong><font size="4">浪淘沙</font></strong> <font size="2">欧阳修</font></p>
<p><strong>把酒祝东风，</strong></p>
<p><em>且共从容。</em></p>
<p><strong>垂杨紫陌洛城东。</strong></p>
<p><em>总是当时携手处，</em></p>
<p><strong>游遍芳丛。</strong></p>
<p><em>聚散苦匆匆，</em></p>
<p><strong>此恨无穷。</strong></p>
<p><em>今年花胜去年红。</em></p>
<p><strong>可惜明年花更好，</strong></p>
<p><em>知与谁同？</em></p><br><br>
来源：https://www.cnblogs.com/GardenofEden/p/16102642.html
頁:
[1]