[分享]css取客户端地址

CSS可以通过伪元素来获取客户端地址，这个伪元素叫做":lang"。下面是一个简单的例子：

<style>
    p:lang(en) {color: blue}
    p:lang(zh) {color: red}
</style>

<p lang="en">This is English text.</p>
<p lang="zh">这是中文文本。</p> 

在上面的代码中，我们使用":lang"伪元素来获取

标签的指定属性值"lang"。在这个属性值中，我们可以指定客户端的语言类型，根据不同的语言类型来应用不同的样式。

如果我们需要获取客户端的IP地址，我们可以借助第三方服务，如"ipstack"。下面是一个示例：

<style>
    #ipAddress:before {
        content: "Your IP address: ";
    }
</style>

<div id="ipAddress"></div>

<script src="https://cdn.ipify.org/ip.js"></script>
<script>
    function callback(response) {
        document.querySelector("#ipAddress").innerText = response.ip;
    }
    const url = "https://api.ipstack.com/check?access_key=your_access_key";
    const script = document.createElement('script');
    script.src = url + "&callback=callback";
    document.head.appendChild(script);
</script> 

在上面的代码中，我们使用了":before"伪元素，在需要显示客户端IP地址的元素DIV上添加了内容"Your IP address: "。然后，我们使用了第三方服务ipify.org来获取到客户端的IP地址，通过JavaScript的回调函数来更新DIV的内容。

需要注意的是，我们可以使用https请求，这样会更安全，但在某些老的浏览器中不支持。我们还可以将请求发送到我们自己的服务器上，然后获取到IP地址，这种方法在安全性和可靠性上会更好。