Hbuilder中怎么调整文字位置和字体样式？

Question

Hbuilder中怎么调整文字位置和字体样式？要求把标题“苏菲卫生巾…分析”位置往下调整，需要上下左右都居中，右边时间显示字体样式改成微软雅黑，并且字体大小调大一号。

以下是css文件

@charset "utf-8";

*{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box}
*,body{padding:0px;    margin:0px;font-family: "微软雅黑";}
body{ background:#000d4a url(../images/bg.jpg) center ; background-size:cover;color:#fff; font-size: .1rem; }

html,body{height: 100%;}
.clearfix:after, .clearfix:before {display: table;content: " "}
 .clearfix:after {clear: both}
.pulll_left{float:left;}
.pulll_right{float:right;}
/*谷哥滚动条样式*/
  ::-webkit-scrollbar {width:5px;height:5px;position:absolute}
  ::-webkit-scrollbar-thumb {background-color:#5bc0de}
  ::-webkit-scrollbar-track {background-color:#ddd}
/***/

.head{ height:5.75rem; background: url(../images/head_bg.png) no-repeat center center; background-size: 100% 100%; position: relative}
.head h1{ color:#fff; text-align: center; font-size:2.3rem; line-height:.8rem; letter-spacing: -1px;}/* .head h1 img{ width:6.5rem; display: inline-block; vertical-align: middle; } */
.time{ position:absolute; right:.15rem; top:15; line-height: .75rem;color:rgba(255,255,255,.7); font-size: .9rem; padding-right: .1rem;font-family:electronicFont;}

以下是网页链接

http://127.0.0.1:8848/%E5%A4%A7%E5%B1%8F%E5%B1%95%E7%A4%BA/introduction.html

Answer 1

下午好🌅🌅🌅
本答案参考ChatGPT-3.5

针对问题，Hbuilder中调整文字位置和字体样式的解决方案如下：

1. 调整标题位置，在 “.head h1” 中添加 “margin-top: 1rem” ，将标题往下调整。

2. 调整文字居中，在 “.head h1” 中添加 “text-align: center” ，将标题水平居中，同时保持垂直方向已经通过上一步调整完成。

3. 右侧时间显示，修改字体样式，在 “.time” 中添加 “font-family: 微软雅黑” ，更改字体样式为微软雅黑。

4. 调整字体大小，将时间字体大小增大一号，在 “.time” 中添加 “font-size: 1rem” 。

修改后的CSS代码如下：

.head h1 {
    color: #fff;
    text-align: center;
    font-size: 2.3rem;
    line-height: .8rem;
    letter-spacing: -1px;
    margin-top: 1rem;     /*添加调整标题位置的代码*/
}

.time {
    position: absolute;
    right: .15rem;
    top: 15;
    line-height: .75rem;
    color: rgba(255, 255, 255, .7);
    font-size: 1rem;      /*调整字体大小*/
    font-family: 微软雅黑; /*更改字体样式*/
    padding-right: .1rem;
}

综上所述，Hbuilder中调整文字位置和字体样式的解决方案为：

1. 在标题所在的CSS选择器中，添加 “margin-top: 1rem” 调整标题位置。

2. 在标题所在的CSS选择器中，添加 “text-align: center” 将标题居中。

3. 在时间所在的CSS选择器中，添加 “font-family: 微软雅黑” 更改字体样式为微软雅黑。

4. 在时间所在的CSS选择器中，添加 “font-size: 1rem” 调整字体大小。

其中，以上代码中的数值可根据具体需求进行修改。