css自学框架之文章样式,article标签

css代码:

/* 文章 */
			article{letter-spacing: .03em;}			
			article a{word-break: break-all;}			
			article > *{ margin-bottom: 1em }
			article > *:last-child{ margin-bottom: 0 }			
			article h1, article h2, article h3{ font-size: 1.2em }
			article h4, article h5, article h6{ font-size: 1.1em }			
			article ul, article ol, article dl{ line-height: 1.8 }

html引用代码:

<article>
			  <p>且说李傕、郭汜既掌大权,残虐百姓;<a href="/">密遣心腹侍帝左右</a>,观其动静。献帝此时举动荆棘。朝廷官员,并由二贼升降。因采人望,<a href="/">特宣朱儁入朝封为太仆</a>,同领朝政。一日,人报西凉太守马腾;并州刺史韩遂二将引军十余万,杀奔长安来,声言讨贼。原来二将先曾使人入长安,结连侍中马宇、谏议大夫种邵、左中郎将刘范三人为内应,共谋贼党。三人密奏献帝,封马腾为征西将军、韩遂为镇西将军,各受密诏,并力讨贼。当下李傕、郭汜、张济、樊稠闻二军将至,一同商议御敌之策。谋士贾诩曰:<h1>“二军远来</h1>,只宜深沟高垒,坚守以拒之。不过百日,彼兵粮尽,<h4>必将自退</h4>,然后引兵追之,二将可擒矣。”李蒙、王方出曰:“此非好计。愿借精兵万人,立斩马腾、韩遂之头,献于麾下。”贾诩曰:“今若即战,必当败绩。”李蒙、王方齐声曰:“若吾二人败,情愿斩首;吾若战胜,公亦当输首级与我。”诩谓李傕、郭汜曰:
			  <ul>“长安西二百里盩厔山,其路险峻,可使张、樊两将军屯兵于此,</ul>
			  <ol>坚壁守之;待李蒙、王方自引兵迎敌,可也。</ol>”李傕、郭汜从其言,点一万五千人马与李蒙、王方。二人忻喜而去,离长安二百八十里下寨。</p>
			  <blockquote>《三国演义》第十回 勤王室马腾举义 报父仇曹操兴师</blockquote>
			  
			</article>

默认将所有 article 标签的子元素做了排版优化,增加间距、设置新的换行机制等,减少重复编写对应的排版样式代码。
效果如下:
在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
### 回答1: 可以使用CSS中的后代选择器(" ")或子选择器(">")来为父元素中的子元素添加样式。例如,以下代码将为所有在class为parent的元素中的class为child的元素设置字体颜色为红色: ```css .parent .child { color: red; } ``` 如果只想为直接子元素设置样式,则可以使用子选择器(">"),例如: ```css .parent > .child { color: red; } ``` 这将只为class为parent的元素下的直接子元素中的class为child的元素设置样式。 ### 回答2: 在CSS中,我们可以使用父标签进行选择器来给字标签添加样式。通过使用父标签选择器,我们可以选择所有父元素下的特定子元素,并给它们添加所需的样式。 例如,如果我们想要给所有父元素下的子元素段落(p)标签添加样式,我们可以使用以下CSS代码: 父标签选择器 { 子元素选择器 { 添加样式 } } 其中,父标签选择器可以是标签名、类名或者id名等,用于选择所有具有该标签、类或id的元素。子元素选择器则是被选择的具体子元素的标签名或类名。 举个例子,假设我们有一个父元素div,其中包含了多个子元素段落(p)标签。我们想要给这些p标签添加红色字体颜色和加粗样式。我们可以使用以下CSS代码: div { p { color: red; font-weight: bold; } } 在这个例子中,div是父标签选择器,p是子元素选择器。这段CSS代码将选择所有div元素下的p标签,并给它们添加红色字体颜色和加粗样式。 通过使用父标签选择器,我们可以轻松地为父元素下的子元素添加样式,实现对网页的样式控制。 ### 回答3: 在CSS中,我们可以通过父标签来给子标签添加样式。这种方法被称为"后代选择器"或"子选择器"。 后代选择器使用空格来选择子元素,例如: ```css 父元素 子元素 { 属性: 值; } ``` 我们也可以通过父标签来选择特定的子元素,例如: ```css 父元素 > 子元素 { 属性: 值; } ``` 这样的话,只有直接作为父元素的子元素才会应用样式。 此外,我们还可以通过给父标签添加特定的类名或ID,来选择并添加样式到子元素。例如: ```html <div class="父元素"> <p>我是子元素</p> </div> ``` ```css .父元素 p { 属性: 值; } ``` 或者 ```html <div id="父元素"> <p>我是子元素</p> </div> ``` ```css #父元素 p { 属性: 值; } ``` 通过以上方法,我们可以方便地通过父标签给子标签添加样式,实现网页设计中的各种效果。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

游戏自学

生活不易,打赏随意

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值