要在HTML5中获取当前位置并在百度地图上显示，你可以按照以下步骤操作：

1. 获取百度地图API密钥（AK）

首先，你需要在百度地图开放平台申请成为百度开发者并获取一个自己的密钥（AK）。百度地图开放平台

2. 引入百度地图API

在你的HTML文件中引入百度地图API，并指定你的AK：

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的密钥"></script>

3. 创建地图容器

在HTML中创建一个容器来显示地图：

<div id="container" style="height:100%;"></div>

4. 初始化地图

使用JavaScript初始化百度地图：

var map = new BMap.Map("container"); // 创建Map实例
var point = new BMap.Point(116.331398, 39.897445); // 创建点坐标
map.centerAndZoom(point, 12); // 初始化地图,设置中心点坐标和地图级别

5. 获取当前位置

使用HTML5 Geolocation API获取当前位置：

var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
    if(this.getStatus() == BMAP_STATUS_SUCCESS){
        var mk = new BMap.Marker(r.point); // 创建标注
        map.addOverlay(mk); // 将标注添加到地图中
        map.panTo(r.point); // 使地图平移到标注点
        alert('您的位置：'+r.point.lng+','+r.point.lat);
    }
    else {
        alert('failed'+this.getStatus());
    }
});

6. 转换坐标并显示位置

由于HTML5 Geolocation API获取的坐标是GPS坐标，而百度地图使用的是经过转换的坐标，所以需要进行坐标转换：

var point = new BMap.Point(r.point.lng, r.point.lat);
BMap.Convertor.translate(point, 0, function(newPoint){
    var marker = new BMap.Marker(newPoint); // 创建标注
    map.addOverlay(marker); // 将标注添加到地图中
    map.panTo(newPoint); // 使地图平移到标注点
});

7. 获取当前位置的地址信息

使用Geocoder获取当前位置的详细地址信息：

var geocoder = new BMap.Geocoder();
geocoder.getLocation(newPoint, function(result){
    if (result){
        alert("您当前所在位置是：" + result.address);
    }
});

以上步骤可以帮助你在HTML5中获取当前位置并在百度地图上显示。请确保替换你的密钥为你从百度地图开放平台获取的实际密钥。

要修改HTML5 input标签中placeholder的颜色，可以使用CSS的伪元素选择器::placeholder。由于不同的浏览器对这个伪元素的支持有所不同，因此需要添加不同的浏览器前缀来确保兼容性。以下是一个示例，展示了如何修改placeholder的颜色：

input::placeholder {
    color: red;
}

input::-webkit-input-placeholder { /* WebKit browsers */
    color: red;
}

input::-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: red;
}

input::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: red;
}

input::-ms-input-placeholder { /* Internet Explorer 10+ */
    color: red;
}

在这个示例中，我们首先使用了标准的::placeholder伪元素选择器来设置placeholder的颜色为红色。然后，我们添加了针对不同浏览器的前缀，以确保在各种浏览器中都能正确显示。

请注意，::-webkit-input-placeholder是针对WebKit内核浏览器（如Chrome和Safari）的前缀，::-moz-placeholder是针对Mozilla Firefox浏览器的前缀，而::-ms-input-placeholder是针对Internet Explorer 10及以上版本的前缀。

此外，如果你想要修改特定input元素的placeholder颜色，可以使用类选择器或ID选择器来定位到该元素，例如：

.input-red::placeholder {
    color: red;
}

#input-red::placeholder {
    color: red;
}

在HTML中，你可以这样使用这些类或ID：

<input type="text" class="input-red" placeholder="请输入内容">
<input type="text" id="input-red" placeholder="请输入内容">

这样，只有带有input-red类或id为input-red的input元素的placeholder颜色会被修改为红色。

以下是一个简单的CSS美化搜索框的示例代码：

HTML结构：

<div class="search-container">
    <input type="text" class="search-input" placeholder="搜索...">
    <button class="search-button">搜索</button>
</div>

CSS代码：

/* 搜索框容器样式 */
.search-container {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 25px;
    overflow: hidden;
    width: 300px;
    height: 40px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

/* 输入框样式 */
.search-input {
    border: none;
    padding: 0 15px;
    height: 100%;
    width: 80%;
    font-size: 14px;
    outline: none;
}

/* 搜索按钮样式 */
.search-button {
    border: none;
    background-color: #007BFF;
    color: white;
    width: 20%;
    height: 100%;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.search-button:hover {
    background-color: #0056b3;
}

这个搜索框具有以下美化特点：

• 整体是一个圆角矩形，有淡淡的边框阴影。
• 输入框和按钮的布局使用了弹性布局（flex），使得两者在容器内排列整齐。
• 输入框没有边框，且鼠标聚焦时没有默认的外框（outline），看起来更简洁。
• 搜索按钮有鼠标悬停效果，背景色会在悬停时发生渐变。

要实现一个高度自适应的textarea且不出现滚动条，可以使用以下的方法：

1. 设置textarea的高度为auto：这样textarea的高度将会随着内容的增加而增加。
2. 使用CSS的box-sizing属性：将其设置为border-box，这样textarea的高度就包括了其边框和内边距的高度。
3. 设置textarea的max-height属性：这样当textarea的高度超过了max-height的值时，就会出现滚动条。因此，将max-height设置为比较大的值，就可以保证textarea的高度一直是自适应的，而不会出现滚动条。

下面是一个示例代码：

textarea {
    height: auto;
    max-height: 300px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    padding: 10px;
}

这段代码将会让textarea自适应高度，且不会出现滚动条，但是当textarea的高度超过300px时，就会出现滚动条。你可以根据实际情况调整max-height的值。

在CSS中，首行缩进通常是通过使用text-indent属性来实现的。如果你想要在CSS中实现首行缩进两个文字，可以使用em或ch单位。em单位是相对于当前字体尺寸的，而ch单位是相对于数字"0"的宽度。

以下是使用text-indent属性实现首行缩进两个文字的示例：

使用em单位

p {
  text-indent: 2em; /* 首行缩进两个字体尺寸 */
}

使用ch单位

p {
  text-indent: 2ch; /* 首行缩进两个"0"的宽度 */
}

HTML示例

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>First Line Indent Example</title>
<style>
  p {
    text-indent: 2em; /* 首行缩进两个字体尺寸 */
  }
</style>
</head>
<body>

<p>这是一个段落。它的首行缩进了两个字体尺寸。这种缩进风格在中文排版中非常常见。</p>

</body>
</html>

请注意，text-indent的效果可能会受到字体大小和行高的影响，因此实际的缩进效果可能需要根据具体的字体和设计需求进行调整。此外，ch单位的使用可能在不同的浏览器和字体中表现不一致，因此在使用时需要进行兼容性测试。