CSS学习(一)

CSS学习(一),第1张

#CSS学习(一)


文章目录
  • 1.CSS文本属性
  • 2.CSS引入方式
  • 3.Emmet语法
  • 4.CSS的复合选择器
  • 5.元素的显示模式


1.CSS文本属性

1.1 文本颜色

    <style>
        div {
            /* color: #c0f;  */
            color: rgb(200, 0, 0);
        }
    style>


1.2 对齐文本

        h1 {
           /* text-align只能设置水平对齐方式; */
           text-align: center;
        }


1.3 装饰文本

        div {
            text-decoration: underline;
        }

        div {
            text-decoration: line-through;
        }

        div {
            /* 删除线 */
            /* text-decoration: line-through; */
            /* 上划线 */
            text-decoration: overline;
        }


1.4 文本缩进

        p {
            text-indent: 20px;
        }


1.5 行间距
line-height

2.CSS引入方式

1.行内样式表

<p style="color: rgb(45, 143, 110);">行内样式表:我的梦想是成为摄影师!p>

2.内部样式表

<style>
        /* 嵌入式引入 */
             div {
                 color :pink;
             }
    style>
head>
<body>
    <div>这个粉色就是内部样式表控制的div>

3.外部样式表

示例:pandas 是基于NumPy 的一种工具,该工具是为了解决数据分析任务而创建的。

3.Emmet语法

4.CSS的复合选择器


1.后代选择器

2.子选择器


3.并集选择器

4.伪类选择器
①.链接伪类选择器
2.:focus选择器

5.元素的显示模式

①块元素

②行内元素

③行内块元素

④元素显示模式的转换
把行内元素转换为块级元素:display:block
转换为行内元素:display:inline-block;
转换为行内块:display:inline-block;

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/langs/733346.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-04-27
下一篇2022-04-27

发表评论

登录后才能评论

评论列表(0条)

    保存